/*********************************************************************************
 * Zurmo is a customer relationship management program developed by
 * Zurmo, Inc. Copyright (C) 2014 Zurmo Inc.
 *
 * Zurmo is free software; you can redistribute it and/or modify it under
 * the terms of the GNU Affero General Public License version 3 as published by the
 * Free Software Foundation with the addition of the following permission added
 * to Section 15 as permitted in Section 7(a): FOR ANY PART OF THE COVERED WORK
 * IN WHICH THE COPYRIGHT IS OWNED BY ZURMO, ZURMO DISCLAIMS THE WARRANTY
 * OF NON INFRINGEMENT OF THIRD PARTY RIGHTS.
 *
 * Zurmo is distributed in the hope that it will be useful, but WITHOUT
 * ANY WARRANTY; without even the implied warranty of MERCHANTABILITY or FITNESS
 * FOR A PARTICULAR PURPOSE.  See the GNU Affero General Public License for more
 * details.
 *
 * You should have received a copy of the GNU Affero General Public License along with
 * this program; if not, see http://www.gnu.org/licenses or write to the Free
 * Software Foundation, Inc., 51 Franklin Street, Fifth Floor, Boston, MA
 * 02110-1301 USA.
 *
 * You can contact Zurmo, Inc. with a mailing address at 27 North Wacker Drive
 * Suite 370 Chicago, IL 60606. or at email address contact@zurmo.com.
 *
 * The interactive user interfaces in original and modified versions
 * of this program must display Appropriate Legal Notices, as required under
 * Section 5 of the GNU Affero General Public License version 3.
 *
 * In accordance with Section 7(b) of the GNU Affero General Public License version 3,
 * these Appropriate Legal Notices must retain the display of the Zurmo
 * logo and Zurmo copyright notice. If the display of the logo is not reasonably
 * feasible for technical reasons, the Appropriate Legal Notices must display the words
 * Copyright Zurmo Inc. 2014. All rights reserved.
 ********************************************************************************/

@import 'mixins.less';

*{
	margin:0;
	padding:0;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box;
}

.strong{
	font-weight: bold;
}

.ui-helper-hidden-accessible,
.hidden-element{
	display:none !important;
	visibility:hidden !important;
}
.temp-hidden{
	display:none;
}

.disabled-select-element{
	pointer-events:none;
}

.disabled{
	pointer-events:none;
	background:#EFEFEF;
}

.right{
	float: right;
}

.left{
	float: left;
}

.underline{
	text-decoration: underline;
}

html.zurmo,
html.zurmo body{
	min-height:100%;
	height: 100%;
}

html.zurmo{
	#gradient > .vertical-three-colors( #f6f6f6, #ffffff, 100px, #ffffff ) !important;
}

.zurmo body{
	font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
	font-size:12px;
	color:@textColor;
	-webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	-o-font-smoothing: antialiased;
	font-smooth: always;
}

a:link, a:hover, a:active, a:visited{
	text-decoration:none;
	outline: none;
	img{
		border:none;
	}
}

a:focus{
	outline:none;
}

a:link, a:active, a:visited{
	color:@textColor;
	cursor: pointer;
}

a:hover{
	color: @themeColor;
}

a:hover, a:active{
	i[class^="icon"],
	i[class^="icon"]:after{
		color: @themeColor2;
	}
}

a, input, button {
	-ms-touch-action: none;
	touch-action: none;
}

h1, h2, h3, h4, h5, h6{
	color: @themeColor;
	.t-shadow(  0 1px 0 rgba( 255, 255, 255, 0.8 ) );
}

/*=HTML5*/
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
	display: block;
}

.ZurmoDefaultPageView,
.ZurmoPageView,
.PageView{
	position: relative;
	z-index:1;
}

/*=Error View*/
.ErrorView h2{
	margin:0 0 100px 0;
	width:85%;
	line-height: 150%;
}

/*=Login*/
.login-container{
	height:100%;
	height: e( "calc(100% - 20px)" ); //20px is footer's top padding
	padding: 30px;
}

#LoginView{
	height:100%;
	.b-shadow(~"0 0 12px 5px rgba(153, 153, 153, 0.3)");
	.radius(5px);
	padding:0;
	.form{
		width:50%;
		float:right;
	}
	.error{
		margin-bottom: 40px !important;
	}
	+ #FooterView{
		margin-left:0;
		padding-left: 0;
	}
}

#login-form{
	padding:5px 0 5px 15px;
	background:none !important;
	border-top:none !important;
	border-right:none !important;
	border-bottom:none !important;
	.b-shadow(~"none !important");
	.reset-filter();
	> div{
		margin-bottom:15px;
	}
	> div:last-child{
		margin-bottom: 0;
	}
	> div.clearfix{
		margin-bottom:0;
	}
	label{
		display:inline-block;
		margin-bottom:5px;
	}
	input[type="password"],
	input[type="text"]{
		background-color: #fff !important;
		margin:0 !important;
	}
	input[type="checkbox"]{
		float:left;
		margin-right:10px !important;
		margin-top:1px !important;
		clear:both;
	}
	.errorMessage{
		font-size:11px;
		padding-top:4px
	}
}

#Login{
	margin-left:0;
}

.remember-me{
	label{
		margin:0 !important;
	}
	.hasCheckBox + label{
		display:inline-block;
		position:relative;
		top:-4px;
		left:6px;
	}
}

#login-box{
	width:500px;
	margin:150px auto 0 -250px;
	height:200px;
	position:relative;
	left:50%;
}

#LoginLogo{
	height:100%;
	width:50%;
	padding-right:10px;
	float:left;
	background: url("@{path}ZurmoLogo.png") 56px 35px no-repeat;
}

.background-1{ background: #fff url("@{path}landscape-1.png") left bottom repeat-x; }
.background-2{ background: #fff url("@{path}landscape-2.png") left bottom repeat-x; }
.background-3{ background: #fff url("@{path}landscape-3.png") left bottom repeat-x; }
.background-4{ background: #fff url("@{path}landscape-4.png") left bottom repeat-x; }
.background-5{ background: #fff url("@{path}landscape-5.png") left bottom repeat-x; }
.background-6{ background: #fff url("@{path}landscape-6.png") left bottom repeat-x; }

/*=MastHead*/
#HeaderLinksView{
	height:38px;
	max-width: 1600px;
	margin:0 auto;
	+ div{
		#gradient > .vertical( @themeColorHeader, @themeColorHeader2 );
	}
	ul ul a:hover{
		color:#fff !important;
		#gradient > .vertical( @themeColor2, darken(@themeColor2, 15%) );
	}
}

#corp-logo{
	float:left;
	height:26px;
	position:relative;
	top:8px;
	color:#fff;
	font-size:14px;
	font-weight:500;
	display: block;
	img{
		max-height:26px;
		width: auto;
		display:inline-block;
		margin-right:10px;
	}
	span{
		position: relative;
		top: -7px;
		line-height:26px;
		display:inline-block;
	}
}


#HeaderLinksView > div{
	margin:0 3% 0 3%;
}

#HeaderLinksView ul{
	list-style: none;
}

#HeaderLinksView li{
	position: relative;
	overflow: visible;
}

#HeaderLinksView li a{
	color:#fff;
	font-weight:bold;
}

#HeaderLinksView li a:hover{
	color:#fff !important;
}

#HeaderLinksView ul ul{
	.headerDropDownSpecial;
}

#HeaderLinksView + div{
	.b-shadow(0 0 10px 2px rgba(102, 102, 102, 0.5));
}

.headerDropDownSpecial{
	z-index:1;
	min-width:110px;
	display:none;
	position:absolute;
	top:37px;
	border:1px solid #444;
	background: #252525;
	.b-shadow(~"0 0 10px 2px rgba(53, 53, 53, 0.5)");
	li{
		line-height: 100%;
	}
	li:first-child a{
		border-top:none;
	}
	li:last-child a{
		border-bottom:none;
	}
	a{
		border-top:1px solid lighten(#252525, 5%);
		border-bottom: 1px solid darken(#252525, 5%);
		color:#EFEFEF;
		font-size:11px;
		font-weight:normal;
		display:block;
		padding:6px 10px 6px 10px;
		margin:0;
		&:hover{
			color: lighten(@themeColorBtn, 75%) !important;
			#gradient > .vertical( @themeColorBtn, darken(@themeColorBtn, 20%) ) !important;
			.t-shadow( 0px -1px 0 darken(@themeColorBtn, 25%) ) !important;
		}
	}
}

#user-toolbar{
	float:right;
	position: static;
	right: 0;
	top: 0;
}

.user-menu-item{
	float: right !important;
}

#notifications-flyout{
	margin:-1px -1px 0 0;
	width:400px;
	min-height: 35px;
	right:0;
	position:absolute;
	padding:5px 10px;
	z-index:1;
	min-width:110px;
	display:none;
	top:38px;
	border:1px solid #444;
	background: #252525;
	.b-shadow(~"0 0 10px 2px rgba(53, 53, 53, 0.5)");

	.z-spinner{
		left:50%;
		top:5px;
		margin-left:-12px;
	}
	.single-notification{
		line-height:125%;
		padding:9px 0;
		border-top:1px solid lighten(#252525, 5%);
		border-bottom: 1px solid darken(#252525, 5%);
		color:#EFEFEF;
		position:relative;
		&:first-child{
			border-top:none;
		}
		&:last-child{
			border-bottom:none;
		}
		h4{
			margin-bottom:2px;
			color:#fff;
			.t-shadow(none);
		}
		div{
			padding-right:40px;
			.smaller();
		}
		.remove{
			position:absolute;
			top:5px;
			right:0;
			float:right;
			margin-right: 0;
			&:hover{
				.icon:after{
					color: #fff !important;
				}
			}
		}
	}
	.view-all-notifications{
		display:block;
		border-top:1px solid lighten(#252525, 5%);
		color:#EFEFEF;
		.smaller();
		padding:9px 0;
	}
	a{
		color:#A7A7A7 !important;
		text-decoration: underline;
	}
	a:hover{
		color:#fff !important;
	}
	img{
		margin-left:182px;
		padding:5px 0;
	}
}

#user-header-menu,
#settings-header-menu,
#header-calendar-link-wrapper,
#header-game-dashboard-link-wrapper{
	position: relative;
	z-index: 100;
	float:left;
	margin:0;
	&:hover{
		> li > a{
			color:#fff;
			background: rgba(255, 255, 255, 0.05);
			&:after{
				color:#fff;
			}
		}
	}
	&.nav-open{
		> li > a{
			color:#fff;
			border-left:1px solid #444 !important;
			border-right:1px solid #444 !important;
			#gradient > .vertical( #353535, #252525 );
			&:after{
				color:#fff;
			}
		}
		ul{
			display: block !important;
		}
	}
	> li{
		> a{
			position: relative;
			z-index: 5;
			padding:0 10px;
			line-height: 38px;
			display:block;
			overflow: visible;
			border-left:1px solid transparent;
			border-right:1px solid transparent;
			color:#ddd;
			&:hover{
				color:#fff;
				border-left: 1px solid @borderColor;
				border-right: 1px solid @borderColor;
			}
		}
	}
	ul{
		display:block;
		width:110px;
	}
}

#user-header-menu{
	margin-right:-1px;
	ul{
		right:0;
		left:auto;
	}
	> li > a:after{
		content: "÷";
		.symbly(12px) !important;
		color:#ddd;
		position: relative;
		top: 0;
		left: 4px;
		font-size: 10px;
		line-height: 1;
	}
}

.avatar-holder{
	.gravatar{
		width: 25px;
		height: 25px;
		margin-right: 10px;
		position: relative;
		top: 8px;
		.radius(13px);
		.b-shadow(~"inset 0 1px 1px 0 rgba(255, 255, 255, 0.2), 0px 1px 1px 1px rgba(0,0,0,0.2)");
		border: none !important;
		background:none;
	}
}

#settings-header-menu{
	margin-left:-1px;
	> li{
		position: relative;
		.t-shadow(none) !important;
		a{
			.t-shadow(none) !important;
		}
	}
	> li > a {
		span{
			display:inline-block;
			text-indent:-9999px;
			.t-shadow(none) !important;
		}
	}
	> li > a:after{
		color:#ddd;
		.symbly(26px);
		line-height: 1;
		display: inline-block;
		vertical-align: middle;
		content: 'n';
	}
	ul{
		right:0;
		display: none;
	}
}

#header-calendar-link,
#header-game-dashboard-link{
	.symbly(28px);
	text-align: center;
	color: #ddd;
	line-height: 18px;
	display: block;
	height: 20px;
	width: 20px;
	margin:0 8px;
	//padding: 0 8px;
	.radius(50%);
	background: transparent;
	position: relative;
	top: 10px;
	&.highlighted{
		color:#fff;
		.b-shadow(0 0 2px 1px rgba(255, 255, 255, 0.9));
	}
}

#header-calendar-link-wrapper,
#header-game-dashboard-link-wrapper{
	a{
		color: #ddd;
		&:hover{
			color: #fff;
		}
	}
}

#header-calendar-link-wrapper{
}

#GlobalSearchAndShortcutsCreateMenuView{
	height:40px;
	max-width: 1600px;
	margin:0 auto;
}

#app-search{
	max-width:340px;
	display:block;
	position:relative;
	float: left;
	margin-left: 15px;
	.z-spinner{
		z-index:999999;
		position:absolute;
		margin-left:316px;
		margin-top:11px;
		float:none;
		display:block !important;
		left:auto;
		right:2px;
	}
}

body > .ui-autocomplete{
	width:335px;
}

#globalSearchInput{
	font-style:italic;
	color:#999 !important;
	text-indent:10px !important;
	line-height:26px !important;
	height:25px;
	width:300px;
	border:1px solid #d5d4d4;
	border-left:none;
	margin:7px 0 0 -3px;
	float:left;
	background: url("@{path}search-bar-gradient.png") left top repeat-x;
	.radius(0);
	.b-shadow(none);
	&:focus{
		outline: 0;
		color:@textColor;
		font-style:normal;
		text-indent: 25px !important;
	}
	&.overlay{
		display: block;
		position: absolute;
		z-index: 999;
		left: 42px;
		~ .z-spinner{
			left: 35px;
		}
	}
}

.autocomplete-icon-AccountsModule:before{
	content: "P";
	.symbly(20px);
	margin-right:8px;
}
.autocomplete-icon-ContactsModule:before{
	content: "y";
	.symbly(22px);
	margin-right:8px;
}
.autocomplete-icon-LeadsModule:before{
	content: ".";
	.symbly(20px);
	margin-right:8px;
}
.autocomplete-icon-OpportunitiesModule:before{
	content: "9";
	.symbly(20px);
	margin-right:8px;
}
.autocomplete-icon-TasksModule:before{
	content: "4";
	.symbly(20px);
	margin-right:8px;
}
.autocomplete-icon-NotesModule:before{
	content: "3";
	.symbly(20px);
	margin-right:8px;
}
.autocomplete-icon-MeetingsModule:before{
	content: "U";
	.symbly(20px);
	margin-right:8px;
}
.autocomplete-icon-UsersModule:before{
	.symbly(20px);
	margin-right:8px;
	content: "e";
}
.autocomplete-icon-ProjectsModule:before{
	.symbly(20px);
	margin-right:8px;
	content: '\02C7';
}
.autocomplete-icon-ProductsModule:before{
	.symbly(20px);
	margin-right:8px;
	content:'\003E';
}
.autocomplete-icon-WorkflowsModule:before{
	.symbly(20px);
	margin-right:8px;
	content:'\20AC';
}
.autocomplete-icon-AllResults:before{
	.symbly(20px);
	margin-right:8px;
	content: "k";
}

.global-search-loopa{
	padding:0;
	margin:7px 0 0 0;
	height:25px;
	float:left;
	line-height:23px;
	width:40px;
	border:1px solid #d5d4d4;
	border-right:none;
	background: url("@{path}search-bar-loopa.png") left top no-repeat;
}

#globalSearchInput .ui-multiselect-menu{
	min-width: 225px !important;
}

.ui-multiselect {
	padding:0;
	text-align:left;
	span.ui-icon {
		float:right;
	}
}

.ui-multiselect-single .ui-multiselect-checkboxes input {
	position:absolute !important;
	top:auto !important;
	left:-9999px;
}

.ui-multiselect-single .ui-multiselect-checkboxes label {
	padding:5px !important;
}

.ui-multiselect-header {
	margin-bottom:0;
	padding:0;
	ul {
		li {
			float:left;
			padding:0 0 0 0;
		}
	}
	a {
		text-decoration:none;
	}
	a:hover {
		text-decoration:underline;
	}
	span.ui-icon {
		float:left;
	}
	li.ui-multiselect-close {
		float:right;
		text-align:right;
		padding-right:0;
	}
}

.ui-multiselect-menu {
	display:none;
	padding:0;
	position:absolute;
	z-index:10000;
}

.ui-multiselect-checkboxes {
	position:relative;
	overflow-y:auto;
	label {
		cursor:default;
		display:block;
		input {
			position:relative;
			top:1px;
		}
	}
	li {
		clear:both;
		padding-right:0;
	}
	li.ui-multiselect-optgroup-label {
		text-align:center;
		font-weight:bold;
		a {
			display:block;
			text-decoration:none;
		}
	}
}

.AppContainer{
	height:100%;
	height: e( "calc(100% - 50px)" );
	border-top:none;
	z-index: 10;
	position:relative;
}

@headerHeight : 50px;
@headerHeight2 : 46px;

.HeaderView{
	width: 100%;
	margin: 0 auto 0 auto;
	position: fixed;
	-webkit-transform: translateZ(0);
	top: 0;
	left: 0;
	right: 0;
	z-index: 15;
	#gradient > .vertical(@themeColorHeader, @themeColorHeader2);
	.b-shadow(0 0 10px 2px rgba(102, 102, 102, 0.7));
	padding-bottom: 3px;
	> .container{
		height: 100%;
		#gradient > .vertical(lighten(@headerBarColor, 5%), darken(@headerBarColor, 5%));
	}
}

.logo-and-search{
	position: absolute;
	top: 0;
	left: 15px;
	z-index: 999;
	#gradient > .vertical(lighten(@headerBarColor, 5%), darken(@headerBarColor, 5%));
}

.user-actions{
	padding: 0 15px 0 0;
	position: relative;
	float: right;
}

.user-menu-item{
	list-style: none;
	position: relative;
	li{
		position: relative;
		overflow: visible;
		a{
			color:#fff;
			font-weight:bold;
		}
		a:hover{
			color:#fff !important;
		}
	}
	ul{
		.headerDropDownSpecial;
		display: none !important;
		list-style: none;
	}
}

.TitleBarView{
	margin-bottom: 15px;
}

/*=Shortcuts nav*/
.GridView{
	position:relative;
}

#ShortcutsMenu{
	position: relative;
	float:right;
	right:3%;
	top:7px;
	ul{
		list-style:none !important;
		margin-top:-8px;
		margin-left:0px;
		.headerDropDown();
		a:hover{
			background-color: @themeColor2 !important;
			color:#fff !important;
		}
	}
	> li{
		list-style:none !important;
		> a{
			padding:0 10px;
			display:block;
			line-height:25px;
			.radius(2px);
			font-size:13px;
			color:#333333;
			.t-shadow(0 1px 0 rgba( 255, 255, 255, 0.8 ));
			font-weight:bold;
			//border:1px solid #DCDCDC;
			.b-shadow(~"inset 0 1px 1px 0 rgba(255, 255, 255, 0.2), 0px 1px 1px 1px rgba(0,0,0,0.2)");
			#gradient > .vertical(#e0e0e0, #c6c6c6);
			&:after{
				content: "÷";
				.symbly(16px);
				margin-left:10px;
			}
			&:hover{
				color:#111 !important;
				.t-shadow(0 1px 0 rgb( 255, 255, 255 ));
				#gradient > .vertical(#c6c6c6, #e0e0e0);
			}
		}
	}
}

/*=Left Sidebar*/
#nav-trigger{
	display:none;
	float: left;
	text-align:center;
	padding:0;
	margin-right:15px;
	line-height: 38px;
	height:38px;
	width: 44px;
	font-size: 24px;
	font-weight: normal;
	.symbly(30px);
}

@navWidth : 170px;

.AppNavigation{
	#gradient > .vertical(#f6f6f6, #f4f4f4);
	border-right:1px solid #eee;
	border-left:1px solid #eee;
	height:100%;
	display:block;
	overflow: visible;
	width: @navWidth;
	float: left;
	#gradient > .vertical(#dcdcdc, #e3e3e3);
	position: fixed;
	top: 0;
	bottom:0;
	z-index: 9999;
	-webkit-transform: translateZ(0);
	//margin-top: @headerHeight;
	li{
		list-style:none;
	}
}

.hidden-nav-item{
	display: none;
}

.toggle-hidden-nav-items{
	display: block;
	text-align: center;
	padding: 0;
	margin: 0;
	cursor:pointer;
	line-height: 1px;
	&:after{
		content: "···";
		font-size: 26px;
		font-weight: bold;
		line-height: 1;
		.t-shadow(0 1px 0 #fff);
	}
	&:hover{
		color: #333 !important;
		background:none !important;
		.b-shadow(none) !important;
	}
}

/*=Menu+Recently Viewed*/
@media all and (max-width: 801px){
	body{
		.nav-collapsed();
	}
}

.nav-collapsed{
	@newWidth : 40px;
	@uiChooserWidth: 38px;
	.AppNavigation{
		z-index: 99;
		width: @newWidth;
		.animateAll(0.1s);
		&:hover{
			z-index:99999;
			width: @navWidth;
			.b-shadow(2px 0 5px 0 rgba(102, 102, 102, 0.3));
			.nav,
			#RecentlyViewedView ul {
				> li > a > span{
					display: inline-block !important;
				}
			}
			.ui-chooser{
				width: 167px;
				padding:8px 10px;
				text-align: left;
			}
			.device{
				float: right !important;
			}
		}
		.nav,
		#RecentlyViewedView ul {
			> li > a > span{
				display: none !important;
			}
		}
	}
	#RecentlyViewedView{
		> h3{
			display: none;
		}
	}
	.ui-chooser{
		width: @uiChooserWidth;
		padding:8px 0;
		text-align: center;
	}
	.device{
		float: none !important;
	}
	.AppContent,
	#FooterView{
		margin-left: @newWidth !important;
	}
	.hideme{
		display: none !important;
	}
}

#MenuView,
#RecentlyViewedView{
	#gradient > .vertical(#dcdcdc, #e3e3e3);
	border-top:1px solid #F9F9FA;
	padding:20px 5px;
	h3{
		color:#666;
		font-size:10px;
		margin-bottom:20px;
		text-indent: 10px;
	}
	li{
		font-size:12px;
		font-weight: bold;
		color:#555;
		margin:0 0 5px 0;
	}
	a{
		line-height: 28px;
		display:block;
		position: relative;
		.radius( 4px );
		.t-shadow( rgba(255, 255, 255, 0.8) 0px 1px);
		width: 100%;
		span{
			display: inline-block;
			.text-overflow();
			line-height: 1;
			position: relative;
			top: 2px;
			left: 8px;
			padding-right: 5px;
			width: 80%;
		}
	}
	.over > a,
	.active a,
	a:hover{
		color: #fff !important;
		background-color: @themeColor2;
		.b-shadow(inset 0 0 20px 5px rgba(0, 0, 0, 0.3));
		.t-shadow( 0px 1px 0 darken(@themeColorBtnDefault, 15%) ) !important;
		i{
			color: darken(@themeColorBtnDefault, 35%) !important;
			.t-shadow( 0px 1px 0 lighten(@themeColorBtnDefault, 15%) ) !important;
		}
	}
	i{
		font-style:normal;
		.symbly(24px);
		width:24px;
		height:24px;
		line-height:22px;
		background:#FFF;
		#gradient > .vertical(#f5f5f5, #ffffff);
		.radius(4px);
		display:inline-block;
		text-align:center;
		position:relative;
		top:1px;
		left: 2px;
	}
	/*deafult for if an icon doesnt exist*/
	li{
		i:before{
			content: "z";
		}
	}
	.type-configuration   i:before{ content:  '\0060'; }
	.type-designer        i:before{ content:  '\00D1'; }
	.type-import          i:before{ content:  "N"; }
	.type-groups          i:before{ content:  '\00DB'; }
	.type-users           i:before{ content:  '\0066'; }
	.type-roles           i:before{ content:  '\00C9'; }
	.type-workflows       i:before{ content:  '\20AC'; }
	.type-contactWebForms i:before{ content:  '\003C'; }
	.type-search          i:before{ content:  "k"; }
	.type-shortcuts       i:before{ content:  "Y"; }
	.type-home            i:before{ content:  "A"; }
	.type-accounts        i:before{ content:  "P"; }
	.type-leads           i:before{ content:  "."; }
	.type-contacts        i:before{ content:  "y"; }
	.type-opportunities   i:before{ content:  "9"; }
	.type-conversations   i:before{ content:  "b"; }
	.type-recently-viewed i:before{ content:  "{"; }
	.type-mashableInbox   i:before{ content:  "g"; }
	.type-marketing       i:before{ content:  '\2021'; }
	.type-reports         i:before{ content:  "V"; }
	.type-UsersModule            i:before{ content: "e"; }
	.type-AccountsModule         i:before{ content: "P"; }
	.type-ContactsModule         i:before{ content: "y"; }
	.type-LeadsModule            i:before{ content: "."; }
	.type-TasksModule            i:before{ content: "4"; }
	.type-MeetingsModule         i:before{ content: "U"; }
	.type-iailMessagiodule       i:before{ content: "g"; }
	.type-MissionsModule         i:before{ content: "Q"; }
	.type-ReportsModule          i:before{ content: "V"; }
	.type-iailTiplatesModule     i:before{ content: '\00B6'; }
	.type-MarketingListsModule   i:before{ content: '\0022'; }
	.type-WorkflowsModule        i:before{ content: '\20AC'; }
	.type-products               i:before{ content: '\003E'; }
	.type-ProductsModule         i:before{ content: '\003E'; }
	.type-ProductTiplatesModule  i:before{ content: '\00AC'; }
	.type-ProductsCategoryModule i:before{ content: '\00D7'; }
	.type-EmailTemplatesModule   i:before{ content: '\00B6'; }
	.type-CampaignsModule        i:before{ content: '\002C'; font-size: 26px; }
	.type-GameRewardsModule      i:before{ content: '\2205'; font-size: 30px; }
	.type-projects               i:before{ content: '\02C7'; font-size: 22px; }
	.type-ProjectsModule         i:before{ content: '\02C7'; font-size: 22px; }
	.type-ConversationsModule{
		i{
			padding-top:3px;
			padding-right:3px;
		}
		i:before{
			content: "b";
		}
	}
	.type-OpportunitiesModule{
		i{
			padding-top:2px;
		}
		i:before{
			content: "9";
		}
	}
	.type-NotesModule{
		i{
			padding-left:4px;
			padding-top:1px;
		}
		i:before{
			content: "3";
		}
	}
	.toggle-hidden-nav-items:hover{
		color: #333 !important;
	}
}

#MenuView{
	border-bottom:1px solid #cccccc;
	padding-top: 65px;
	padding-bottom: 0;
	#gradient > .vertical(#f6f6f6, #f4f4f4) !important;
	&.hasNoHiddenItems{
		padding-bottom: 20px;
		.toggle-hidden-nav-items{
			display: none;
		}
	}
	i{
		background: none;
		color: #999;
	}
	.unread-inbox-count{
		display: inline-block;
		.radius(4px);
		font-size: 11px;
		width: auto;
		padding: 1px 4px 3px 4px;
		line-height: 1;
		color:#fff !important;
		@topColor: #c43d53;
		@bottomColor: #a82d31;
		#gradient > .vertical(@topColor, @bottomColor ) !important;
	}
	&.admin-menu{
		.parent ul{
			display: none;
			position: absolute;
			left: 100%;
			margin-top: -28px;
			z-index: 999;
			color:#EFEFEF;
			list-style: none;
			min-width: 100px;
			white-space: nowrap;
			border:1px solid #444;
			background: #252525;
			.b-shadow(~"0 0 10px 2px rgba(53, 53, 53, 0.5)");
			.radius(2px);
			a:hover{
				color: lighten(@themeColorBtn, 75%) !important;
				#gradient > .vertical( @themeColorBtn, darken(@themeColorBtn, 20%) ) !important;
				.t-shadow( 0px -1px 0 darken(@themeColorBtn, 25%) ) !important;
			}
			&:hover, &.stayOpen, &.nav-open{
				display: block;
			}
			&:before{
				content: "";
				border: 8px solid #252525;
				border-top-color: transparent;
				border-left-color: transparent;
				border-bottom-color: transparent;
				position: absolute;
				left: -16px;
				top: 5px;
			}
			li{
				line-height: 1;
				margin: 0;
			}
			li:first-child{
				border-top:none;
			}
			li:last-child{
				border-bottom:none;
			}
			.divider{
				border-top:1px solid darken(#252525, 5%);
				border-bottom: 1px solid lighten(#252525, 5%);
				margin:5px 5px;
			}
			li > a{
				color:#EFEFEF;
				.smaller();
				font-weight:normal;
				line-height: 1;

				display:block;
				width: auto;
				padding:6px 10px 6px 10px;
				margin:1px;
				.t-shadow(none);
				.radius(0);
				span{
					width: 100%;
					left: 0;
					top: 0;
				}
			}
			label{
				color:#EFEFEF;
			}
			i{
				display: none;
			}
		}
	}
}

#RecentlyViewedView {
	i{
		.symbly(@recentlyViewedIconSize);
	}
}

/*=Content*/
@recentlyViewedIconSize : 24px;

#InstallView,
#ErrorView,
.AppContent{
	.clearfix();
	min-height: 100%;
	padding:65px 20px 0 20px;
	margin-left:@navWidth;
	#gradient > .vertical-three-colors( #f6f6f6, #ffffff, 50%, #ffffff );
	background-attachment: fixed;
	//.animateAll(0.28s);
	.single-column{
		padding-right:0 !important;
		> .GridView{
			display:block;
			width:100% !important;
		}
		//.panel{}
		.juiportlet-widget,
		.details-table{
			margin-right:0 !important;
			.clearfix();
		}
		.right-side-edit-view-panel{
			top:55px;
		}
		#inline-edit-form .panel{
			width:100%;
		}
	}
}

#ErrorView{
	margin-left: 0;
	padding: 75px 15% 15px 15%;
	p{
		font-size: 14px;
		line-height: 1.5;
	}
	div{
		font-weight: bold;
		font-size: 18px;
		margin-top: 30px;
		color: #a82d31;
	}
	#ZurmoLogo{
		margin: 0 0 15px 0;
	}
	+ #credit-link{
		position: absolute;
		left: 15%;
		bottom: 10px;
	}
}

.DynamicSearchView{
	position: relative;
	//z-index: 9999;
	float: left;
	width: 100%;
	display: table;
}

#MashableInboxActionBarForViews,
#ActionBarSearchAndListView{
	> div{
		position: relative;
	}
	> :nth-child(1) {
		z-index:10;
	}
	> :nth-child(2) {
		z-index:9;
	}
	> :nth-child(3) {
		z-index:8;
	}
	> :nth-child(4) {
		z-index:7;
	}
	> :nth-child(5) {
		z-index:6;
	}
	> :nth-child(6) {
		z-index:5;
	}
}

/*=dashboard*/
#HomeDashboardView{
	float: left;
	width:100%;
	.view-toolbar-container{
		position: relative;
		z-index: 10;
	}
	.juiportlet-columns{
		position: relative;
		z-index: 1;
	}
}

/*=Inner toolbar*/
.float-bar{
	width: 100%;
	float: left;
	position: relative;
	height: 40px;
	display: block;
	z-index: 10;
	padding: 0 15px 0 15px;
	margin-bottom: 15px;
	.view-toolbar-container{
		z-index:222222;
		position:fixed !important;
		-webkit-transform: translateZ(0);
		width: auto;
		padding-bottom:10px;
		margin-left: -20px;
		left: 50%;
		bottom: 0;
		//float: left;
		border: 1px solid #ccc;
		.b-shadow(~"inset 0 0 0 1px #ffffff,  0 0 5px 2px rgba(153, 153, 153, 0.3)");
		#gradient > .vertical-three-colors( #efefef, #efefef, 80%, #f5f5f5 );
		&.dock{
			background:none;
			position:static !important; //was relative
			//bottom:0;
			//left:0;
			width: 100%;
			.unstyle-panel();
			border-top:1px solid #CCC;
		}
	}
}

.view-toolbar-container{
	display:inline-block;
	width: 100%;
	position: relative;
	z-index: 9999;
}

h1 + .view-toolbar-container{
	margin-top: 15px;
}

.widgets-lock{
	z-index: 0;
	position: relative;
	margin-top: -36px;
	margin-bottom: 15px;
	float: right;
	.pillbox{
		float: right;
		margin-bottom: 0 !important;
	}
}

.juiportlet-widget-head{
	.view-toolbar-container{
		float: right;
		width: auto;
	}
	.view-toolbar{
		margin-bottom: 0;
	}
}

form,
.ActionBarForSecurityTreeListView,
#ActionBarForDesignerModuleView,
#LeaderboardView,
#UsersPageView{
	.view-toolbar-container{
		float: none;
	}
}

.view-toolbar,
.portlet-view-toolbar{
	.smaller();
	border:1px solid #b7b7b7;
	border-top-color: #e7e7e7;
	border-left-color:#d7d7d7;
	border-right-color:#d7d7d7;
	border-radius:4px;
	float:left;
	margin:0 0 15px 0;
	.b-shadow(0 0 9px 5px rgba(153, 153, 153, 0.12));
	background:url("@{path}view-toolbar-gradient.png") left bottom repeat-x;
	.z-label{
		float:none;
		padding:0;
		display:inline;
	}
	> a,
	.parent > a{
		.view-toolbar-link;
		position:relative;
		border-left: none;
		border-left: 1px solid #bababa;
		text-indent:0 !important;
		line-height: 30px;
		vertical-align:middle;
	}
	.parent > a:after{
		content: "÷";
		.symbly(14px);
		margin-left:10px;
		position:relative;
		top:1px;
	}
	ul:first-child .parent > a{
		border-left: none;
	}
	> ul, > a{
		display:inline-block;
	}
	ul{
		list-style:none;
	}
	.parent{
		> ul{
			margin-top:0;
			.headerDropDown();
			left:auto;
			a:hover{
				background-color: @themeColor2 !important;
				color:#fff !important;
			}
		}
	}
	> a:first-child{
		border-left:none;
	}
	> a:hover,
	> a:active,
	> a:hover:before,
	> a:active:before,
	> a:hover span,
	> a:active span,
	.active,
	.active > a span,
	.active > a:before,
	.nav > li > a:hover,
	.nav > li > a:active{
		color: @themeColor2;
	}
}

.view-toolbar + .view-toolbar {
	float: right;
}

.portlet-view-toolbar{
	float:right;
	margin:0 0 0 0;
	.parent{
		position: relative;
	}
	ul:last-child{
		border-right:1px solid #d7d7d7;
	}
}

#ActionBarForGroupsTreeListView,
#ActionBarSearchAndListView{
	.view-toolbar{
		margin-top:0;
	}
}

.view-toolbar-link{
	color:#656565;
	font-weight:bold;
	text-shadow:#fff 0 -1px 0;
	padding:0 10px 0 10px;
	line-height:30px;
	display:inline-block;
	border-left:1px solid #bababa;
}

.view-toolbar-link:active{
	color:#656565;
	box-shadow: inset 0 10px 10px 4px rgba(153, 153, 153, 0.4), 0 1px 0 0 #FFF;
}

.mini-pillbox{
	label{
		margin-right: 10px;
		.smaller() !important;
		line-height:26px !important;
	}
	.pills{
		display: inline-block;
		.smaller();
		border:1px solid #b7b7b7;
		border-top-color: #e7e7e7;
		border-left-color:#d7d7d7;
		border-right-color:#d7d7d7;
		.radius(3px);
		#gradient > .vertical( #ffffff, #f5f5f5 );
		.b-shadow(~"inset 0 -2px 0 0 rgb(255, 255, 255), 0 0 5px 2px rgba(153, 153, 153, 0.12)");
	}
	a{
		font-weight: 700;
		position:relative;
		border-left: 1px solid #bababa;
		color:#656565;
		text-shadow:#fff 0 1px 0;
		padding:0 6px;
		line-height:24px;
		display:inline-block;
		border-left:1px solid #bababa;
		&:first-child{
			border-left: none;
		}
		&:active{
			color:#656565;
			box-shadow: inset 0 10px 10px 4px rgba(153, 153, 153, 0.4), 0 1px 0 0 #FFF;
		}
		&:hover,
		&.active{
			color: @themeColor2;
		}
	}
}


.hasDetailsFlyout{
	.DetailsView > div:not(.view-toolbar-container){
		.unstyle-panel() !important;
		line-height: 150%;
		margin: 10px 0;
	}
	ul{
		max-width: 50%;

		padding: 10px;
		line-height: 150%;
	}
}

/*=Footer*/
#FooterView{
	//position: relative;
	float: left;
	z-index: -1;
	margin:0 0 0 @navWidth;
	padding:20px 0 10px 20px;
	.animateAll(0.28s);
}

.xhtml-validation-info,
.performance-info{
	color: @themeColor;
	text-align: left;
	margin:0 3% 15px 3%;
	font-style: italic;
	.smaller();
}

#credit-link{
	background:url("@{path}Zurmo.png") left top no-repeat;
	line-height: 19px;
	display:inline-block;
	.smaller();
	span{
		margin-left:70px;
	}
}

.ui-chooser{
	float: right;
	display: block;
	z-index: 999999;
	position: fixed;
	left: 0;
	bottom: 0;
	width: 167px;
	padding:8px 10px;
	margin: 0 1px;
	border-top:1px solid #ccc;
	.b-shadow(inset 0 1px 0 0 #F9F9FA);
	#gradient > .vertical(#dcdcdc, #e3e3e3);
	span{
		text-indent: -9999px;
		display: none;
	}
	a{
		display: inline-block;
		width: 22px;
		height: 22px;
		text-align: center;
		cursor: pointer;
		.opacity(50);
		margin: 0 5px 0 0;
		color: #656565;
		font-size:24px;
		line-height: 22px;
		vertical-align:middle;
		padding:0 0 0 0;//3px;
		position: relative;
	}
	.active{
		color:#7CB830;
		.opacity(100);
		.t-shadow(0 0 15px #7CB830);
	}
	.icon-mobile:after,
	.icon-desktop:after{
		font-weight: bold;
	}
	.device{
		display: inline-block;
		float: right;
	}
}

table {
	border-collapse: separate;
	border-spacing: 0;
}

caption, th, td {
	font-weight: normal;
	text-align: left;
}

#list-view{
	overflow-x:hidden;
	position:relative;
	background: #fefefe;
	.items-wrapper{
		border: 1px solid #dfdfdf;
		//border-bottom: 1px solid #dfdfdf;
	}
}

.items-wrapper{
	width: 100%;
	display: table;
	overflow-x:auto;
	background:
		-webkit-linear-gradient( left, #fff 30%, rgba(255,255,255,0) ),
		-webkit-linear-gradient( left, rgba(255,255,255,0), #fff 70% ) 100%,
		-webkit-radial-gradient( 0    50%, farthest-side, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0) ),
		-webkit-radial-gradient( 100% 50%, farthest-side, rgba(0, 0, 0, 0.1), rgba(0, 0, 0, 0) ) 100% 0;
	background-repeat: no-repeat;
	background-size: 30px 100%, 30px 100%, 15px 100%, 15px 100%;
	background-attachment: local, local, scroll, scroll;
}

.items{
	width:100%;
	border-collapse: collapse;
	border-spacing: 1px;
	> tbody,
	> thead{
		td{
			border: 1px solid #DFDFDF;
			border-right:none;
			border-left:none;
			vertical-align:middle;
			padding:10px 5px;
			word-wrap: break-word;
			-webkit-transform: translateZ(0); //fix for chrome painting issue/bug
		}
	}
	> tbody,
	> thead{
		> tr > th{
			font-weight:bold !important;
			height:35px;
			line-height: 35px;
			background: url("@{path}table-items-header.png") left top repeat-x;
			padding:0 5px;
			white-space: nowrap;
		}
	}
	tr:hover{
		#gradient > .vertical(#efefef, #eeeeee);
		background-color: transparent !important;
		.pencil{
			visibility:visible;
			color: @themeColor;
		}
	}
	> thead{
		#gradient > .vertical(#f9f9f9, #f4f4f4);
		tr:hover{
			#gradient > .vertical(#f9f9f9, #f4f4f4);
		}
		th:first-child{
			//border-left:1px solid #DFDFDF;
		}
	}
	> tbody{
		tr:last-child,
		tr:last-child td{
			border-bottom: none;
		}
		tr{
			td:first-child:not(.checkbox-column),
			th:first-child:not(.checkbox-column){
				padding-left:10px;
			}
		}
	}
}

.stacked-list{
	table-layout: fixed;
	td + td{
		width:25px
	}
	td{
		padding-left:0;// !important;
		div.button-column{
			display:none;
			float:right;
			margin:5px 0 0 0;
			line-height: 100%;
		}
		div.checkbox-column{
			float:left;
			margin:-6px 0 0 0 !important;
			width:auto;
			label{
				margin:0 5px 0 0;
			}
			~ div{
				padding-left:25px;

			}
		}
		> div{
			margin:0 0 2px 0;
		}
		> div:last-child{
			margin-bottom: 0;
		}
		input[type="checkbox"]{
			margin-right:10px;
			margin-top:2px;
			float:left;
		}
	}
	.star-column{
		margin:-6px 15px 0 0 !important;
		float:right
	}
	tr:first-child{
		> div:first-child{
			font-size: 13px;
			font-weight: bold;
			margin:0 0 3px 0;
		}
	}
}

.juiportlet-widget-content .stacked-list{
	border: none;
	tr:first-child td{
		border-top: none !important;
	}
}


.sort-link:after{
	//content:"↑";
	margin-left: 10px;
	font-size: 12px;
	position: relative;
	top: -1px;
}

.sort-link.asc:after{
	content:"↑";
}

.sort-link.desc:after{
	content:"↓";
}

tr.odd{
	background:none;
	.animateAll(0.05s);
}

tr.even{
	.animateAll(0.05s);
}

.checkbox-column{
	width:30px;
	text-align:center;
	.hasCheckBox{
		margin:-4px auto 0 auto;
	}
}

.button-column{
	width:35px;
	text-align:center;
	vertical-align:middle !important;
}

.pencil{
	display:block;
	margin-top:-2px;
	.symbly(24px);
	visibility:hidden;
}

.star-column{
	width:20px;
	text-align:center;
	padding:0 !important;
}

.icon-star{
	.symbly(26px);
	color:#ccc !important;
	.t-shadow(0 0 1px #333);
	top:-1px;
	position:relative;
	line-height:1;
	&:hover,
	&.starred{
		color: #ffef42 !important;
	}
}

#list-view_columnStar{
	line-height:1;
	width: 20px;
	text-align: center;
	padding-right: 0 !important;
	padding-left: 0 !important;
	.icon-star{
		top:0;
		left:-2px;
	}
}

h1,
.juiportlet-widget-head{
	.icon-star{
		top:1px;
		margin-left:5px
	}
}


.juiportlet-widget{
	.empty{
		padding:5px 0 10px 0;
		display:block;
	}
	td.empty > .empty{
		padding:0 !important;
	}
}

.empty{
	display:block;
	.smaller();
	font-weight: bold;
	//background: rgba(255, 255, 255, 0.5);
	text-align:center;
	.icon-empty{
		display: block;
		line-height: 1;
		margin: 0;
	}
	.icon-empty:before{
		margin: 0;
		font-size:40px;
		line-height:1;
	}
}

td.empty{
	display:table-cell !important;
	border-top:none !important;
}

.view-toolbar-icons(@size: 24px){
	.symbly(@size);
	padding:0;
	margin:0;
	vertical-align:middle;
	position:relative;

}

.icon-notice:before{
	content: "j";
	.view-toolbar-icons();
}

.icon-empty:before{
	content: "z";
	.view-toolbar-icons();
	margin:0 !important;
}

.general-issue-notice{
	text-align: center;
	width:75%;
	margin:10px auto 15px auto !important;
	position: relative;
	.icon-notice{
		display: block;
		line-height: 1;
		//margin-bottom: 10px;
	}
	.icon-notice:before{
		margin: 0;
		font-size:40px;
		//line-height: 60px !important;
	}
	p{
		//font-size: 14px;
		//line-height: 21px;
	}
}

/*forms*/
.text-input(){
	font-family:"Helvetica Neue", Helvetica, Arial, sans-serif;
	display:inline-block;
	border:1px solid #ccc;
	.radius(3px);
	font-size:12px;
	color:#666 !important;
	text-indent:6px;
	line-height: 24px;
	height:26px;
	.b-shadow(0 0 1px 1px rgba(153, 153, 153, 0.3));
	.ie-shadow(#999999, 1, 15);
	width:100%;

	&:focus{
		.b-shadow(0 0 1px 1px @themeColor);
	}
}

input[type="text"],
input[type="password"],
select.multiple,
textarea{
	.text-input();
}

textarea,
select.multiple {
	height:auto;
}

textarea{
	line-height: 135%;
	text-indent: 0;
	padding: 4px;
	word-break: normal;
	min-height: 60px;
}

select.multiple {
	padding: 4px 4px 4px 6px;
	option{
		margin-bottom: 2px;
	}
}

select[disabled="disabled"],
input[type="text"][disabled],
input[type="password"][disabled],
textarea[disabled] {
	background:#EFEFEF;
}

input[type="button"]:hover,
input[type="button"]:hover:before,
input[type="button"]:hover:after{
	color: @themeColor2;
}


.form{
	input[type="checkbox"]{
		margin:0 0 10px 0 !important;
		.b-shadow(0 0 1px 1px rgba(153, 153, 153, 0.3));
	}
	form{
		border:1px solid #CCC;
		.b-shadow(0 0 20px 5px rgba(153, 153, 153, 0.12)); /*999*/
		background: #ffffff;
		#gradient > .vertical(#ffffff, #F5F5F5);

		thead tr th:first-child,
		tbody tr td:first-child{
			padding-left:15px;
		}
	}
}

.row-description{
	display: inline-block;
	font-style: italic;
	.smaller();
	padding: 0 0 5px 0;
	&:before{
		content:"T";
		.symbly(24px);
		margin-right: 6px;
		font-style: normal;
		position: relative;
		top: 2px;
	}
}

.hasCheckBox + .row-description{
	margin-left: 10px;
}

.AppContent label{
	font-size:12px;
	color:#666;
	font-weight:400;
}

/*=Form Edit Account*/
.modal-view-toolbar,
.form-toolbar{
	padding-top:13px;
	text-align:center;
	border-top:1px solid #fff;
	a{
		display:inline-block;
		margin:0 10px;
	}
}

.portlet-toolbar{
	float: right;
	margin-right: 10px;
	line-height: 1;
	.z-label{
		padding:0 10px 0 10px;
		.smaller();
	}

	.icon-create:hover{
		color: @themeColor2 !important;
	}

	/*
	.icon-create:before{
		content: "";
		margin:0;
		padding:0;
		display: none;
		color: @themeColor2 !important;
	}*/
	.portlet-create-button .z-label:before,
	.icon-create .z-label:before{
		content: "Y";
		.view-toolbar-icons();
		font-size:22px;
		top:-2px;
		margin:0 5px 0 0 !important;
	}
	.icon-delete:before{
		content: "—";
		.view-toolbar-icons();
		top:-1px;
		//color:#fff;
		color: @themeColor2;
		margin-left:0;
	}
	.icon-edit:before{
		content: "!";
		.view-toolbar-icons();
		top:-1px;
		//color:#fff;
		color: @themeColor2;
		margin-left:0;
	}
}

.juiportlet-widget-head .portlet-toolbar{
	margin-top: 7px;
}

/*
body div.form-toolbar{
	a.simple-link:not(.z-button){
		background:none !important;
		background-image:none !important;
		.b-shadow( ~"none  !important" );
		.radius(~"0 !important");
		padding:0  !important;
		border: none !important;
		//margin:!important;
		text-decoration:underline;
		font-weight:normal;
		&:hover{
			span.z-label{
				background:none !important;
				background-image:none !important;
				background: transparent !important;
			}
		}
		span.z-label{
			background:none !important;
			background-image:none !important;
			.b-shadow( ~"none  !important" );
			.radius(~"0 !important");
			padding:0  !important;
			border: none !important;
			margin-left:10px;
			text-decoration:underline;
			font-weight:normal;
			&:before{
				content:""  !important;
			}
		}
	}
}
*/

.normal-size{
	font-size: 12px !important;
}

//needed for specifity
.portlet-toolbar{
	a.simple-link{
		background:none !important;
	}
}

/*=Popup Modals*/

/*
@-webkit-keyframes growDialog {
	to { -webkit-transform:scale(1, 1) }
}
*/

.openingModal{
	-o-animation: growDialog 0.25s;
	-ms-animation: growDialog 0.25s;
	-moz-animation: growDialog 0.25s;
	-webkit-animation: growDialog 0.25s;
	animation: growDialog 0.25s;
}

.ui-dialog{
	min-width: 600px;
	max-width: 50%;
	overflow: visible;
	padding:0 !important;
	margin:0 !important;
	border:1px solid #CCCCCC;
	background:#fff;
	.b-shadow(0 0 15px 0 rgba(51, 51, 51, 0.25)); /*33*/
	.wide.form{
		padding:0;
		margin:0;
		border:none;
		.b-shadow(none);
		float:none;
		form{
			border:none;
			.b-shadow(none);
		}
		label{
			font-size: 12px !important;
			color: #666;
			font-weight: 400 !important;
			margin-bottom: 4px;
		}
	}
	.ui-dialog-title{
		color: @themeColor;
		padding:0 !important;
		margin:0 !important;
		font-size:15px;
		font-weight:bold;
		.t-shadow( rgba( 255, 255, 255, 0.8 ) 0 1px 0 );
		line-height: 40px;
		#gradient > .vertical(#f6f6f6, #ededed);
		.b-shadow(inset 0 1px 0 0 #ffffff);
		border-bottom:1px solid #dfdfdf;
		text-indent:15px;
		width: 100%;
		height: 100%;
		display: block;
	}
	.ui-dialog-titlebar {
		padding:0 !important;
		margin:0 !important;
		z-index:11000;
	}
	.ui-dialog-titlebar-close {
		position: absolute;
		right: -15px;
		top: -15px;
		width:30px !important;
		height: 31px !important;
		.opacity(100);
		display:block;
		z-index:11000;
		&:hover{
			border:none;
			background:none;
		}
		.ui-icon-closethick{
			background: transparent url("@{path}widget-close-btn.png") left top no-repeat;
			padding: 0 !important;
			margin:0 !important;
			width:30px !important;
			height: 31px !important;
			text-indent: -9999px;
			display: block;
			&:hover{
				background: transparent url("@{path}widget-close-btn.png") left top no-repeat;
			}
		}
	}
}

.big-spinner{
	margin:15px 50%;
	display:block;
}

.ui-resizable-handle{
	z-index: 0;
}

.ui-corner-all{
	border-radius: 0;
}

.ui-widget-header{
	border:none !important;
	background:none !important;
}

.ui-widget-overlay {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background:rgba(255, 255, 255, 0.5 );
}

.ui-sortable{
	list-style: none;
	> .ui-state-highlight{
		min-height: 45px;
		background: #efefef;
	}
}

/*=Checkboxes*/
label.hasCheckBox{
	display: block;
	background: url("@{path}checkbox.png") left 4px no-repeat;
	width:16px;
	height:20px;
	padding:0;
	margin:0;
	&.c_on {
		background: url("@{path}checkbox.png") left -21px no-repeat;
	}
	input {
		position: absolute;
		left: -9999px;
	}
	input[disabled] {

	}
	&.disabled{
		.opacity(50);
	}
	& + label{
		margin-left:8px;
		margin-top:6px;
	}
}

div.wide.form{
	position: relative;
	width: 100%;
	float: left;
	label.hasCheckBox{
		margin-top:0 !important; //was !important
	}
	a{
		//color: @themeColor;
	}
}

.ui-multiselect-checkboxes label {
	padding-left: 25px;
	background: url("@{path}checkbox.png") left 4px no-repeat;
	margin-left:0px;
}

.ui-multiselect-checkboxes label.c_on {
	background: url("@{path}checkbox.png") left -21px no-repeat;
}

.ui-multiselect-checkboxes label input {
	position: absolute;
	left: -9999px;
}

/*=LIST VIEW*/
/*=Search Scope box, and account list*/
.list-item-details{
	display: inline-block;
	float: right;
	font-weight: normal;
	color:#999;
	margin-right: 5px;
	.smaller();
}

.last-comment{
	font-weight: 400;
	color:#666;
	margin-left: 5px;
	font-style:italic;
}

.summary{
	display: none;
}

.list-view-items-summary-clone{
	.smaller();
	float: right;
	position: absolute;
	z-index: 100;
	right: 15px;
	margin:20px 0 0 0;
	color:#666;
	.t-shadow(0 1px 0 rgba(255, 255, 255, 0.8));
}

.juiportlet-widget-head .list-view-items-summary-clone{
	position: relative;
	margin: 0;
}

.list-preloader{
	z-index: 1000;
	display:none;
	background: rgba(0, 0, 0, 0.5);
	.b-shadow(  0 0 30px 0 rgba(100, 100, 100, 0.7) );
	position:absolute;
	top:40px;
	left:50%;
	.radius(6px);
	width:28px;
	height:28px;
	margin:-15px 0 0 -15px;
	.z-spinner{
		width:auto;
		height:auto;
		display:block;
		margin:4px 0 0 4px;
	}
}

.juiportlet-widget{
	.list-preloader{
		top:50%;
	}
}

.overlay-spinner{
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba( 255, 255, 255, 0.5 );
	.big-spinner{
		width:auto;
		height:auto;
		display:block;
	}
}

.loading > .list-preloader{
	display:block;
}

.cgrid-view.loading{
	> .list-preloader{
		display:block;
	}
}

/*
#NoUserEmailConfigurationYetView,
#NoGlobalEmailConfigurationYetView,
.ZeroModelsYetView*/
.zero-components-view,
.splash-view {
	h2{
		font-family:"Times New Roman", Times, serif;
		font-style:italic;
		font-size:48px;
		line-height:1;
		font-weight:normal;
		padding:15px 50px 15px 30px;
	}
	i{
		font-size:13px;
		color:#555;
		font-weight:bold;
		display:block;
		margin-left:30px;
	}
	p{
		font-size:16px;
		line-height:24px;
		color:#555;
		font-weight:bold;
		float:left;
		width:65%;
		margin:45px 0 0 30px;

	}
	a{
		margin-left:30px;
		margin-top:30px;
		float:left;
		.radius(3px);
		display:block;
		overflow: hidden;
		position: relative;
		cursor:pointer;
	}
	a span:before{
		content: "Y";
		.symbly(24px);
		position: relative;
		top: 1px;
		left:-5px;
		margin-right:3px;
	}
	.large-icon{
		width:25%;
		text-align:center;
		margin-top:30px;
		border-right:1px solid #ccc;
		float:left;
	}
	.large-icon:after{
		content: 'j';
		.symbly(300px);
		line-height: 52%;
	}
	.Contact .large-icon:after{
		content:"y";
		.symbly(300px);
		line-height: 50%;
	}
	.Account .large-icon:after{
		content:"P";
		.symbly(300px);
		line-height: 65%;
	}
	.Lead .large-icon:after{
		content:".";
		.symbly(300px);
		line-height: 65%;
	}
	.Opportunity .large-icon:after{
		content:"9";
		.symbly(300px);
		line-height: 80%;
	}
	.Conversation .large-icon:after{
		content:"b";
		.symbly(230px);
		line-height: 90%;
	}
	.Mission .large-icon:after{
		content:"Q";
		.symbly(230px);
		line-height: 80%;
	}
	.EmailMessage .large-icon:after{
		content:"g";
		.symbly(325px);
		line-height: 52%;
	}
	.EmailTemplate .large-icon:after{
		content:'\00B6';
		.symbly(325px);
		line-height: 52%;
	}
	.MarketingList .large-icon:after{
		content: '\0022';
		.symbly(300px);
		line-height: 52%;
	}
	.Campaign .large-icon:after{
		content: '\002C';
		.symbly(300px);
		line-height: 52%;
	}
	.Product .large-icon:after{
		content: '\003E';
		.symbly(300px);
		line-height: 52%;
	}
	.ProductTemplate .large-icon:after{
		content: '\00AC';
		.symbly(300px);
		line-height: 52%;
	}
	.ProductCategory .large-icon:after{
		content: '\00D7';
		.symbly(300px);
		line-height: 52%;
	}
	.ContactWebForm .large-icon:after{
		content: '\003C';
		.symbly(300px);
		line-height: 52%;
	}
	.GameReward .large-icon:after{
		content:'\2205';
		.symbly(300px);
		line-height: 52%;
	}
	.Task .large-icon:after{
		content:'4';
		.symbly(300px);
		line-height: 62%;
	}
	.Project .large-icon:after{
		content:'\02C7';
		.symbly(300px);
		line-height: 65%;
	}
	.QueueModel .large-icon:after{
		content:'\00EF';
		.symbly(300px);
		line-height: 52%;
	}
}


#NoUserEmailConfigurationYetView{
	.z-label{
		z-index:auto;
	}
}

.ZurmoSearchView{
	padding:0;
	.b-shadow( 0 0 20px 5px rgba(153, 153, 153, 0.12) );
	float:left;
	width:100%;
}

#search-form{
	padding:0 10px 15px 10px;
	border:1px solid #dfdfdf;
	border-bottom: none;
	position: relative;
	#gradient > .vertical( #f5f5f5, #ebebeb );
	.b-shadow(0 0 20px 5px rgba(153, 153, 153, 0.12)); /*999*/
	.smaller();
	float: left;
	width: 100%;

	.clearfix();
	.form-toolbar, .z-button{
		font-size:12px;
	}
	table{
		border-bottom:none;
		width:100%;
	}
	.filters-bar{
		width: auto;
		top:20px;
		> div{
			float: left;
			padding-left: 15px;
		}
	}
}

.SecuredListView{
	float:left;
	width:100%;
	margin-bottom:20px;
	position: relative;
}

#MashableInboxListView,
#NotificationsForUserListView{
	.SecuredListView();
}

.filters-bar{
	.filter-portlet-model-bar();
	border: none;
	float: left;
	position: absolute;
	z-index: 51;
	left: 250px;
	top:7px;
	background: none !important;
	.b-shadow(none);

	> div + div{
		display: inline-block;
		margin-left: 15px;
	}
	.ui-state-active,
	label:hover{
		background-color: @themeColor;
	}
}

.cgrid-view{
	position:relative;
}

.juiportlet-widget-content{
	width: 100%;
	height: 100%;
	display:block;
	.cgrid-view{
		width: 100%;
		.b-shadow(none);
		overflow-x: hidden;
	}
}

.search-view-0{
	margin:15px 0 0 0;
	display: block;
	position: relative;
	float: left;
	width: 100%;
	z-index: 50;
	table{
		padding: 0;
		margin: 0;
		top:0;
		left: 0;
		border:none;
	}
	th{
		display: none;
		width: 0;
	}
	.global-search-loopa{
		position: relative;
		top:0;
		margin-top:0;
		float:left;
	}
	input[type="text"]{

		position:relative;
		left:-1px;
		width:179px;
		float:right;
		margin:0 0 0 0;
		.radius(0);
		.b-shadow(none);
		font-style: italic;
		color: #999;
		text-indent: 10px;
		line-height: 25px;
		height: 25px !important;
		border: 1px solid #d5d4d4;
		border-left: none;
		background: url("@{path}search-bar-gradient.png") left top repeat-x;
		&:focus{
			outline: none !important;
			box-shadow:none !important;
		}
	}
}

.search-form-tools{
	color: @themeColor;
	position: absolute;
	z-index:100;
	top:16px;
	left:265px;
	line-height:25px;
	.smaller();
	input[type="submit"]{
		.z-button();
	}
	> a{
		margin-right: 25px;
	}
}

#more-search-linkmodal,
#more-search-link{
	margin-left:0;
}

#more-search-linkmodal,
#more-search-link,
#kanban-board-options-link,
#select-list-attributes-link{
	color: @themeColor;
	&:after{
		content: "÷";
		.symbly(14px);
		position:relative;
		top:1px;
		margin-left:5px;
	}
	&:hover{
		color: @themeColor2;
	}
}



#mixed-models-form-search{
	margin-left:15px;
	color:#fff;
}

#ModalView{
	.list-view-items-summary-clone{
		margin:10px 10px 0 0;
	}
	.SearchView{
		position: relative;
		z-index: 5;
	}
	.search-view-0{
		margin:5px 0 0 10px !important;
		width:220px;
		float:left;
		z-index: 10000;
	}
	.search-view-1{
		.flyout;
		z-index:10000;
		min-width:400px;
		max-width:75%;
		height:auto;
		position:absolute;
		left:250px;
		top:35px;
		padding:20px 20px 20px 20px;
		.smaller();
		input{
			position: relative;
			z-index: 5000;
		}
		td{
			padding-bottom:15px;
		}
		th{
			width:25%;
		}
		label{
			padding-top:0;
		}
	}
	.items{
		border: none;
		thead tr:first-child th{
			border-top:none;
		}
	}
}

#clear-search-linkmodal{
	margin-left:10px;
	color: #fff;
	padding: 3px;
	.radius(3px);
	.smaller();
	background: @themeColor;
}

.kanban-board-options-view,
.select-list-attributes-view,
.search-view-1{
	margin-top:15px;
	z-index:100;
	min-width:400px;
	height:auto;
	float: left;
	width: 100%;
	#cancel-advanced-search{
		color:#656565;
		.t-shadow(none);
		.z-label{
			background: url("@{path}view-toolbar-gradient.png") left bottom repeat-x !important;
		}
	}
	.view-toolbar-container{
		border-top:1px solid #CCCCCC;
		z-index: 1;
	}
	> div{
		display: block;
	}
	.view-toolbar-container{
		display: inline-block;
	}
}

.select-list-attributes-view,
.search-view-1{
	label{
		padding-top:7px;
		padding-right:10px;
		width:100%;
		display:block;
		text-align:left;
	}
}

.select-list-attributes-view{
	table{
		border-bottom: none;
	}
	td{
		padding-left: 0 !important;
	}
	.attributesContainer:after{
		display: none !important;
	}
	.multiselect-nav-updown{
		display: block;
		position: absolute;
		right:-75px;
		float:right;
		padding:0 15px;

		width:75px;
		height:75px;
		text-align:center;
		left: auto;
	}
}

#clear-search-link{
	.z-link();
	.icon-clear{
		.symbly(16px);
	}
}

.mp-divider{
	padding:0 2px;
}

#show-dynamic-search-structure-div-search-form{
	display: inline-block;
	width: 100%;
}

.search-view-1 > .hasDropDown{
	margin-bottom:8px;
}

.dynamic-search-row{
	float: left;
	width: 100%;
	display: block;
	margin:8px 0;
	> div{
		float: left;
		width: 100%;
		> span:first-child + div{
			margin-right: 0 !important;
			width: 45%;
			float: left;
		}
		.criteria-value-container{
			margin-right: 30px !important;
			width: 45%;
			float: right;
		}
		.has-model-select{
			float:left;
			width:100%
		}
	}
	label.hasCheckBox{
		margin-left:0 !important;
	}
	.remove-extra-dynamic-search-row-link{
		float: right;
		margin: 4px 0 0 -30px !important;
		position: relative;
		display: block;
		.symbly(24px);
		color:#a7a7a7 !important;
		&:hover{
			color: @themeColor !important;
		}
	}
	.dynamic-search-row-number-label{
		float: left;
		line-height: 26px;
		margin-right:15px;
		font-weight: bold;
		.t-shadow(0 1px 0 rgba(255, 255, 255, 0.8));
	}
}

.add-fields-container,
.search-save-container{
	float: left;
	display: inline-block;
	margin:8px 3px 10px 0;
}

.dynamic-search-row + .add-fields-container,
.dynamic-search-row + .add-fields-container + .search-save-container{
	margin:8px 3px 10px 0;
}

.add-fields-container{
	a{
		margin-left:23px;
		position:relative;
		&:hover,
		&:hover .z-label{
			background: none !important;
			.t-shadow(none) !important;
			color: @themeColor !important;
		}
	}
	.z-spinner{
		display: block !important;
		margin-top: -5px;
		margin-left:-20px;
	}
	.z-label{
		font-weight:normal;
		padding:0;
		line-height:1;
		float:none;
		background: none;
		color: @themeColor;
		.t-shadow(none) !important;
	}
}

#show-dynamic-search-structure-wrapper-search-form{
	display: block;
	width:100%;
	float: left;
}

#show-dynamic-search-structure-div-link-search-form{
	display: block;
	margin-bottom: 15px;
	margin-left:23px;
}

#save-search-area{
	width: 45%;
	margin-top:5px;
	border-top:none;
	input, a{
		display: inline-block;
		width: auto;
		float: left;
		margin-right:15px;
	}
	input{
		width: 50%;
		margin-left:5px;
	}
	#removeSavedSearch{
		line-height: 26px;
		float: left;
		margin-left: 20px;
		.icon:after{
			position: relative;
			top:0;
			left: 0;
			right:0;
		}
	}
	#save-advanced-search{
		margin:0;
	}
}

#show-dynamic-search-structure-div-search-form{
	input{
		text-indent: 40px;
	}
	span{
		width: auto;
		padding: 0 12px;
		font-weight:bold;
	}
}

.ui-multiselect-menu{
	.flyout;
	padding:10px !important;
	overflow: hidden;
	min-width:150px;
	label{
		padding-top:0;
	}
	input[type="checkbox"]{
		margin:0 10px 0 0 !important;
	}
	li{
		list-style: none;
		line-height:25px;
		display:block;
	}
}

/*=Edit + Add Account View*/
/*
.buffer{
	//.clearfix();
	//padding-left:30px;

	> div{
		float:left;
		padding:8px 10px;
		background:#F4F4F4;
		width:100%;

	}
}
*/
.double-column{
	.panel{
		float:left;
		width:100% !important;
		table{
			width:100% !important;
		}
	}
	.right-side-edit-view-panel{
		margin-bottom:15px;
		position:relative !important;
		float:left !important;
		.buffer{
			padding-left:5px;
		}
	}
	.col-0, .col-2{
		width:15% !important;
	}
	.col-1, .col-3{
		width:35% !important;
	}
}

.wide.form{
	.col-0{
		width:30%;
	}
	.col-1{
		width:70%;
	}
}

.attributesContainer{
	padding-bottom:15px;
	.clearfix();
}

.left-column{
	padding: 15px 15px 15px 15px;
	float: left;
	width: 70%;

	&.full-width{
		width: 100%;
		float:none;
		+.right-column{
			display: none;
		}
	}
	.left-column{
		padding: 0 15px 0 0;
	}
	.right-column{
		padding: 0 0 15px 0;
	}
}

.right-column{
	float: right;
	width: 30%;
	padding:15px 15px 15px 15px;
}

.strong-right{
	position: relative;
	> .left-column{
		width: 30%;
		z-index: 100;
		position: relative;
	}
	> .right-column{
		width: 70%;
		z-index: 1;
		position: relative;
		overflow: hidden;
	}
}

#modal-edit-form,
#edit-form,
#delete-form{
	.clearfix();

	position: relative;
	.panel{
		table{
			width:100% !important;
		}
	}
	h3{
		margin:0 0 15px 0;
	}
	.panelTitle{
		margin:0 0 10px 0;
		padding:0;
		font-size:12px;
		display:block;
	}
	.view-toolbar-container{
		border-top:1px solid #CCCCCC;
	}
	.hasCheckBox{
		//margin:8px 0 0 0;
		display:block;
		input[type="checkbox"]{
			margin-bottom:0 !important;
		}
	}
}

.form-fields{
	width:100%;
	border-bottom:none;
	table-layout: fixed;
	th{
		vertical-align: text-top;
	}
	td{
		vertical-align: top;
		position: relative;
	}
	td table{
		width:100%;
	}
	td{
		padding-bottom: 15px;
	}
}


#modal-edit-form{
	padding: 15px 15px 12px 15px;
}

.more-panels-link{
	color: @themeColor;
	.smaller();
	position: relative;
	left: 0;
}

.ui-overlay-block{
	z-index:250000;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	//background: rgba(255, 255, 255, 0.8);
	#gradient > .vertical-three-colors( #f6f6f6, #ffffff, 50%, #ffffff );
	.opacity(50);
	display: none;
	.big-spinner{
		position: relative;
		top:30%;
		left: 50%;
		margin: 0 0 0 -34px;
	}
}

.address-fields{
	div:last-child{
		padding-bottom:0;
	}
	.overlay-label-field{
		padding-bottom: 15px;
	}
}

.radio-input{
	clear: left;
	float: left;
	margin-bottom: 5px;
	input{
		float: left;
		margin-top: 1px !important;
	}
	label{
		margin-left: 10px;
	}
}

.right-side-edit-view-panel{
	padding: 8px 10px;
	background: #F4F4F4;
	width: 100%;

	.clearfix();
	p{
		line-height: 140%;
	}
	h3{
		margin:0 0 10px 0 !important;
	}
	label{
		width: 100%;
		display: block;
		line-height: 100%;
		padding-top:0;
		margin-bottom: 5px;
	}
	#owner-box{
		margin-bottom:15px;
		position: relative;
		label, &+label{
			font-size:12px;
			font-weight:600;
		}
		input{
			position: relative;
			z-index:0;
		}
	}
	.ui-autocomplete{
		width:auto;
	}
	input[type="text"]{
		margin-bottom: 4px;
	}
	#owner-box + label{
		margin-bottom:15px;
	}
	.radio-input{
		margin-bottom:10px;
		width:100%;
		float:left;
		display: block;
		label{
			width:auto;
			float:left;
			vertical-align: middle;
		}
		input[type="radio"]{
			float:left;
			margin:0 8px 0 10px;
			vertical-align: middle;
		}
		.hasDropDown{
			padding-left:40px;
		}
	}
	input[type="text"]{
		margin-top:6px;
	}
	.buttons-bar{
		margin-top: 15px;
		text-align: center;
	}
}

.has-date-select,
.has-model-select,
.has-color-picker,
.has-unit-input{
	position: relative;
	//width:100%;
	input{
		width:100%;
	}
}

.has-model-select{
	clear:left;
	padding:0 !important;
	input{
		margin:0 !important;
	}
	a{
		background: url("@{path}dropdown-general.png") left top no-repeat;
		width:28px;
		height:24px;
		display:block;
		float:right;
		z-index:5000;
		position: absolute;
		right:1px;
		bottom:1px;
		&:hover{
			&:before{
				color:#525252 !important;
			}
		}
		.model-select-icon{
			width:100%;
			height:100%;
			line-height:24px;
			display:block;
			text-align:center;
			vertical-align:center;
			&:before{
				content:"Y";
				.symbly(26px);
				color:#8b8b8b;
				text-align:center;
			}
		}
	}
	.z-spinner{
		z-index:999999;
		position:absolute;
		top:3px;
		left:5px;
		display:block !important;
	}
	+ .simple-link{
		display: block;
		margin-top: 5px;
	}
}

.has-date-select{
	clear:left;
	padding:0 !important;
	input{
		margin:0 !important;
	}
	button{
		background: url("@{path}dropdown-general.png") left top no-repeat;
		width:28px;
		height:24px;
		display:block;
		float:right;
		z-index:1;
		position: absolute;
		right:1px;
		bottom:1px;
		border:none;
		padding:0;
		cursor:pointer;
		z-index: 10005;
		&:hover{
			&:before{
				color:#525252 !important;
			}
		}
		span{
			width:100%;
			height:100%;
			line-height:24px;
			display:block;
			text-align:center;
			vertical-align:center;
			&:before{
				content:"U";
				.symbly(24px);
				color:#8b8b8b;
				text-align:center;
				vertical-align:bottom;
			}
		}
	}
}


.has-color-picker{
	> span{
		background: url("@{path}dropdown-general.png") left top no-repeat;
		width:28px;
		height:24px;
		display:block;
		float:right;
		z-index:5000;
		position: absolute;
		right:1px;
		bottom:1px;
		cursor: pointer;
		pointer-events:none;
		i{
			width:100%;
			height:100%;
			line-height:24px;
			display:block;
			text-align:center;
			vertical-align:center;
			font-size:26px;
			top: 0;
		}
	}
	&:hover{
		i{
			color:#525252 !important;
		}
	}
	.iris-picker{
		z-index: 9999;
		position: absolute;
	}
}

.has-unit-input{
	> span{
		background: url("@{path}dropdown-general.png") left top no-repeat;
		width:28px;
		height:24px;
		display:block;
		float:right;
		z-index:5000;
		position: absolute;
		right:1px;
		bottom:1px;
		cursor: pointer;
		pointer-events:none;
		i{
			width:100%;
			height:100%;
			line-height:24px;
			display:block;
			text-align:center;
			vertical-align:center;
			font-size:12px;
			font-weight: bold;
			top: 0;
			font-family:inherit;
		}
	}
	&:hover{
		i{
			color:#525252 !important;
		}
	}
	.icon-pixel:after{
		content: "px";
	}
	.icon-percentage:after{
		content: "%";
	}
}



.beforeOptOutCheckBox{
	float:left;
	width:100%;
	div{
		margin-right:80px !important;
		width:auto;
	}
}

.beforeOptOutCheckBox + div{
	float: right;
	margin:0 0 0 -80px !important;
	position:relative;
	padding-left: 10px;
	width: 80px;
}

.beforeToolTip{
	float:left;
	width:100%;
	textarea{
		margin-right:30px !important;
		width:auto;
		float:none;
		width:95%;

	}
	.hasDropDown{
		margin-right: 30px;
		width: auto;
	}
}

.beforeToolTip + .tooltip{
	float: right;
	margin:7px 0 0 -30px !important;
	position:relative;
}

/*=View AccountView (before editing, portlets and such)*/
.SecuredPortletFrameView{
	.juiportlet-widget-head h3{
		margin-left:15px;
		font-size:15px;
	}
}

.ConfigurableMetadataView{
	.juiportlet-widget-head{
		cursor:default;
	}
}

.juiportlet-widget-content{
	.details-table{
		.unstyle-panel();
		border: none !important;
		.b-shadow(none) !important;
		.col-0{
			width: 30%;
		}
		.double-column{
			.col-0, .col-2{
				width: 22% !important;
			}
			.col-1, .col-3{
				width: 28% !important;
			}
		}
	}
}

.details-table{
	position:relative;
	margin:0px !important;

	table{
		margin:0 0 10px 0;
	}
	/*.col-0{
		width: 30%;
	}
	.double-column{
		.col-0, .col-2{
			width: 22% !important;
		}
		.col-1, .col-3{
			width: 28% !important;
		}
	}*/
	td, th{
		font-weight: bold;

		padding:5px 5px 5px 5px;
	}
	th{
		vertical-align:top;
		color:#999;
		padding-left:15px;
		text-align: right;
	}
	td{
		vertical-align:top;
		color:@textColor;
		word-wrap: break-word;
		word-break: break-all;
	}
	td + th{
		padding-left:15px !important;
	}
	p{
		width:100%;
	}
	.panelTitle{
		padding-top:0;
		padding-left:10px;
	}
	.map-link{
		display: inline-block;
		margin-left:4px;
		position: relative;
		padding-left: 16px;
	}
	.map-link:before{
		content:"K"; //L=
		.symbly(26px);
		line-height: 12px;
		position: absolute;
		left: 0;
		top:2px;
	}
	.hasCheckBox{
		margin-top:0;
		margin-left:0;
	}
	h1 + .toolbar-mbmenu{
		top: 6px;
		right: 0px;
		position: absolute;
		.parent > ul{
			top: 27px;
		}
	}
}

#AccountContactAffiliationEditAndDetailsView,
#AccountAccountAffiliationEditAndDetailsView{
	.wrapper{
		position: relative;
	}
	.toolbar-mbmenu{
		top: 6px;
		right: 0px;
		position: absolute;
	}
}

.DetailsView{
	.col-0{
		width: 20%;
	}
}

.after-form-details-content{
	color:@textColor !important;
	float:none;
	clear:left;
	width:100%;
	.smaller();
	font-style:italic;
	text-align:center;
	padding: 0 10px 10px 10px;

	a{
		//color: @themeColor;
	}
}

.mapcanvas{
	width:600px;
	height:400px;
}

/*=tasks portelt*/
.OpenTasksRelatedListView{
	.button-column,
	.checkbox-column{
		height:auto !important;
	}
}

/*=For single meeting, contact etc..*/
.AppContent.TableOfContentsView,
.AppContent.SecuredEditAndDetailsView{
	.toolbar-mbmenu{
		//top:8px;
	}
}

.wrapper{
	float:left;
	width:100%;
	margin-right:20px;
	margin-bottom:20px;
	border:1px solid #ccc;
	.b-shadow(~"inset 0 0 0 2px #ffffff,  0 0 9px 5px rgba(153, 153, 153, 0.12)");
	#gradient > .vertical-three-colors( #ffffff, #f5f5f5, 80%, #f5f5f5 );

}

.wrapper,
.TitleBarAndDetailsView > div:not(.view-toolbar-container),
.ProgressView           > div:not(.view-toolbar-container),
#MetadataViewEditView   > div:not(.view-toolbar-container),
.TableOfContentsView    > div:not(.view-toolbar-container),
.DetailsView            > div:not(.view-toolbar-container),
.EditAndDetailsView     > div:not(.view-toolbar-container){
	margin-bottom:20px;
	border:1px solid #ccc;
	.b-shadow(~"inset 0 0 0 2px #ffffff,  0 0 9px 5px rgba(153, 153, 153, 0.12)");
	#gradient > .vertical-three-colors( #ffffff, #f5f5f5, 80%, #f5f5f5 );
	.form form{
		border:none;
		background:none;
		.b-shadow(none);
	}
	h1{
		text-indent:15px;
		font-size:15px;
		height: 40px;
		line-height: 40px;
		#gradient > .vertical(#f6f6f6, #ededed);
		.b-shadow(inset 0 1px 0 0 #ffffff);
		border-bottom:1px solid #ccc;
		overflow: hidden;
	}
	//for opt in email checkboxes
	input[type="checkbox"] + label{
		width:60px;
		margin-top:0;
	}
	//for address fields
	td > label:first-child{}
	//for 2 columns
	td + th{
		padding-left:30px;
	}
}

.SecuredEditAndDetailsView,
#AccountEditAndDetailsView{
	position: relative;
}

.toolbar-mbmenu{
	margin:0 10px 0 0 !important;
	float:right;
	width:auto;
	.view-toolbar{
		border:none;
		.b-shadow(none);
		background: none;
	}
	ul{
		list-style: none;
	}
	.options-menu > li > a{
		.animateAll(0.28s);
		text-align:center;
		border-top:   1px solid rgba(200, 200, 200, 0.4);
		border-left:  1px solid rgba(185, 185, 185, 0.4) !important;
		border-right: 1px solid rgba(185, 185, 185, 0.4);
		border-bottom:1px solid rgba(170, 170, 170, 0.4);
		line-height: 1;
		.smaller();
		.radius(2px);
		color:#666;
		.t-shadow( 0px -1px 0 rgba(255, 255, 255, 0.75) ) !important;
		#gradient > .vertical( #fefefe, #f5f5f5 );
		.b-shadow(~"inset 0 1px 1px 0 rgba(255, 255, 255, 0.2), 0 0 4px 0 rgba(153, 153, 153, 0.15)");
		span{
			line-height: 26px;
			.radius(2px);
			.smaller();
		}
		&:hover{
			color: @themeColor2 !important;
			#gradient > .vertical( #f5f5f5, #fefefe ) !important;
			.t-shadow( 0px -1px 0 rgba(255, 255, 255, 0.75) ) !important;
			.b-shadow(~"inset 0 1px 1px 0 rgba(255, 255, 255, 0.5), 0 0 8px 0 rgba(50, 50, 50, 0.3)");
		}
		&:after{
			content: "÷";
			.symbly(14px);
			top:0;
			margin-left:5px;
		}
	}
	.options-menu ul{
		white-space: nowrap;
		.flyout;
		margin-top:0;
		padding-top:3px;
		padding-bottom:3px;
		display:none;
		font-weight:normal !important;
		right:0;
		z-index: 9999;
		a{
			text-indent:0;
			.smaller();
			font-weight: normal;
			display: block;
			padding: 5px 10px 5px 10px;
			margin: 0 2px;
			line-height: normal;
			.t-shadow(none);
			&:hover{
				background-color: @themeColor2 !important;
				color:#fff !important;
			}
		}
	}
}

.AttributeDetailsView{
	.toolbar-mbmenu{
		top:8px;
	}
}

.clickable-mbmenu{
	&.nav-open{
		ul{
			display: block;
		}
	}
}

.DetailsAndRelationsView,
#AccountDetailsAndRelationsView{
	.clearfix();
	.GridView{
		width:35%;
		float:left;
		.juiportlet-widget{
			margin-right:0;
		}
	}
	.GridView:first-child{
		width:65%;
		.juiportlet-widget{
			margin-right:20px;
		}
	}
}

#UserDetailsAndRelationsView{
	.clearfix();
	.GridView{
		z-index: 0;
		width:65%;
		float:left;
		.juiportlet-widget{
			margin-right:0;
		}
	}
	.GridView + .GridView{
		width:35%;
	}
	.UserLatestActivtiesForPortletView{
		margin-right:20px !important;
	}
}

#NoteInlineEditView{
	.col-0{
		width:100%;
	}
	.col-1{
		width:0%;
	}
	.wide.form{
		padding:0;
		margin:0;
		border:none;
		.b-shadow(none);
	}
	td {
		width:100%;
	}
	td div{
		margin-left:0;
	}
	.files{
		float: left;
	}
	form{
		background:none;
		border:none;
		.b-shadow(none);
		table{
			border-bottom:none;
			td{
				padding-left:0 !important;
			}
		}
		#Note_description{

			height:60px;
			width:100%;
			margin-bottom:10px;
			line-height: 130%;
		}
		input[type="submit"]{
			float:right;
			cursor:pointer;
			padding:0 15px;
			line-height:23px;
			margin:0 0 0 0;
			font-size:12px;
			font-weight:bold;
			.radius( 4px );
			.b-shadow(0 0 9px 5px rgba(153, 153, 153, 0.12));
			border-top:1px solid #e7e7e7;
			border-left: 1px solid #d7d7d7;
			border-right:1px solid #d7d7d7;
			border-bottom:1px solid #bababa;
			color:#333333;
			background: url("@{path}view-toolbar-gradient.png") left bottom repeat-x !important;
			display:inline-block;
			.t-shadow( rgba(255, 255, 255, 0.8) 0px 1px);
			&:active{
				color:#656565;
				.b-shadow(~"inset 0 10px 10px 4px rgba(153, 153, 153, 0.4), 0 1px 0 0 #FFF");
			}
			&:before{
				content: "Y";
				.view-toolbar-icons();
				top: -1px;
				margin-left:2px;
			}
		}
		input[type="submit"]:hover{
		}

	}
	.form-toolbar{
		border-top:none;
	}
}

#NoteInlineEditForPortletView .wide.form{
	.unstyle-panel;
	float: none;
}

#inline-edit-form{
	.unstyle-panel;
	//padding: 15px 15px 15px 0;
	table + table{
		float:left;

	}
	.panel td{
		padding-bottom: 15px;
		padding-left: 0;
	}
	> table{
		td > a{
			color: @themeColor;
			&:after{
				content: "÷";
				.symbly(14px);
				margin-left: 5px;
			}
		}
		label{
			margin-top:10px !important;
			margin-bottom:4px;
		}
		input.ui-autocomplete-input{
			float:left;
			width:100%;
		}
		input.ui-autocomplete-input + span{
			float: left;
			width: 80px;
			margin-left: -90px;
			text-align:right;
			margin-top:6px;
		}
	}
	table{
		border-bottom: none;
	}
	.left-column{
		padding-bottom: 0;
	}
	.view-toolbar-container{
		display: inline-block;
		padding: 0 15px 15px 15px;

		a{
			float:right;
			clear: both;
			margin:0;
		}
	}
	.form-toolbar{
		border-top:none;
		padding-top:0;
	}
	textarea{
		line-height: 130%;
	}
}

#inline-edit-form .permissions-box{
	margin-left:0 !important;
	.clearfix();
	> label{
		margin-bottom:12px !important;
		font-size:13px;
		font-weight:bold !important;
	}
	label{
		width: 100%;
		display: block;
		line-height: 100%;
		padding-top:0;
	}
	#owner-box{
		margin-bottom:15px;
		position:relative;
		label, &+label{
			font-size:12px;
			font-weight:600;
		}
	}
	input[type="text"]{
		margin-bottom: 4px;
	}
	#owner-box + label{
		margin-bottom:15px;
	}
	div.radio-input{
		margin-left:0 !important;
		margin-bottom:10px;
		width:100%;
		float:left;
		display: block;
		input[type="radio"] + label{ /*for specifity*/
			width:auto;
			float:left;
			vertical-align: middle;
			margin:0 0 0 0 !important;
		}
		input[type="radio"]{
			float:left;
			margin:0 8px 0 10px;
			vertical-align: middle;
		}
		.hasDropDown{
			padding-left:30px;
		}
	}
	input[type="text"]{
		margin-top:6px;
	}
}

div.radio-input{
	.hasDropDown{
		//float: left;
		margin-top:8px;
		padding-left:24px;
		margin-bottom:0;

	}
}

.post-to-profile{
	float: right;
	margin-right:25px;
	margin-top:5px;
	position: relative;
	span{
		float: left;
		position: relative;
		margin-right:5px;
	}
	.tooltip{
		margin-top:-1px;
	}
	label.hasCheckBox{
		float: left !important;
		position: relative;
		top: -5px;
		margin: 0;
	}
}


/*=Sticky search*/
.BreadCrumbView{
	position: relative;
	z-index: 10;
	display: inline-block;
	&+div{
		position: relative;
		z-index: 1;
		float: left;
		width: 100%;
	}
	.spinner{
		margin-top:-10px;
		margin-left:20px;
	}
	> div{
		display: inline-block;
	}
}

#StickyListMenu{
	list-style: none;
	> li > a > span{
		top:0;
		position: absolute;
		display: block;
		margin-left: 10px;
		width:13px;
		padding: 1px;
		text-align: center;
		line-height: 1;
		color: #666;
		border:1px solid #fff;
		.b-shadow(inset 0 0 0 1px #ddd);
		.t-shadow(0 1px 0 #fff);
		.radius(2px);
		#gradient > .vertical(#e8e8e8, #f5f5f5);
		.symbly(14px);
	}
	ul{
		.flyout;
		display: none;
		list-style: none;
		position: absolute;
		margin-top:3px;
		margin-left:11px;
		padding-top:3px;
		padding-bottom:3px;
		font-weight:normal !important;
		.strong{
			a, span{
				font-weight: bold !important;
			}
		}
		a{
			text-indent:0;
			color: #666;
			.smaller();
			font-weight: normal;
			display: block;
			padding: 5px 10px 5px 10px;
			margin: 0 2px;
			line-height: normal;
			.t-shadow(none);
			&:hover{
				background-color: @themeColor2 !important;
				color:#fff !important;
			}
		}
	}
}



/*=Madlib*/
.mad-lib{
	input{
		width:auto !important;
		margin:auto 10px !important;
	}
}

/*=Temp Addreess Fields*/
.overlay-label-field{
	position:relative;
	//padding-bottom:15px;
	.clearfix();
}

.overlay-label-field label {
	position: absolute !important;
	text-indent: 4px;
	top: 6px;
	color: #999;
	font-size: 12px;
	font-weight: normal;
}

.overlay-label-field input{

}

.hasParallelFields,
.hasHalfs{
	.clearfix();
	> div{
		display:block;
		float:left;
		padding-left: 15px;
		&:first-child{
			padding-left: 0;
		}
		input{
			width:100%;
		}
	}
}

.hasHalfs{
	> div:first-child{
		padding-right: 7.5px;
		+ div{
			padding-left: 7.5px;
		}
	}
}

.has3{
	> div{
		width:33.3%
	}
}

.seventh{       width: 14.2%; }
.sixth{         width: 16.6%;}
.fifth{         width:20%;}
.twoFifths{     width:40%;}
.threeFifths{   width:60%;}
.fourFifths{    width:80%;}
.half{          width:50%;}
.quarter{       width:25%;}
.threeQuarters{ width:75%;}
.third{         width:33.3%;}
.twoThirds{     width:66.6%;}

.juiportlet-widget.OpportunitiesForAccountRelatedListView,
.juiportlet-widget.ContactsForAccountRelatedListView{
	div.button-column{
		padding-top:4px;
	}
}

/*Related lists portlet with gear menu*/
.RelatedListView{
	.items{
		td{
			border-top:none !important;
		}
		td:first-child{
			padding-left: 15px;
		}
		tr{
			&:hover{
				.edit-row-menu > li > a{
					.opacity(100);
				}
			}
		}
	}
}

.edit-portlet-menu,
.edit-row-menu{
	float:right;
	margin:0 10px 0 0;
	list-style: none;
	> li{
		position: relative;
		.t-shadow(none) !important;
		> a{
			padding:0;
			display:block;
			overflow: visible;
			.opacity(50);
			white-space: nowrap;
			span{
				display:inline-block;
				text-indent:-9999px;
				.t-shadow(none) !important;
			}
			&:hover{
				.opacity(100);
			}
		}
		> a:before{
			content: "n";
			.symbly(24px);
		}
		> a:after{
			content: "÷";
			.symbly(12px);
			position: relative;
			top:-2px;
			left:2px;
		}
		a{
			.t-shadow(none) !important;
		}
	}
	ul{
		min-width:110px;
		margin-left:-85px;
		list-style: none;
		.headerDropDown;
		top:20px;
		.smaller();
		a:hover{
			background-color: @themeColor2 !important;
			color:#fff !important;
		}
	}
}

.edit-portlet-menu{
	line-height: 1;
	margin-top:9px;
	margin-right: 15px;
	ul{
		top: 20px;
	}
}

.edit-row-menu{
	white-space: nowrap;
	> li{
		position: relative;
		white-space: nowrap;

	}
	> li > a{
		position: relative;
		z-index: 10;
		white-space: nowrap;
	}
	ul{
		min-width: 0;
		line-height: 1;
		white-space: nowrap;
		left: auto;
		right: -10px;
		margin:0;
		top:-3px;
		z-index: 1;
		padding-right: 30px;
		.radius(0 15px 15px 0);
		> li{
			+ li{
				margin-left: -3px; //for teh white space
			}
			display:inline; // can't float cause it breaks in FF
			border-left: 1px solid #d8d8d8;
			a{
				display: inline-block;
				//padding: 0 10px;
			}
			&:first-child{
				border-left: none;
			}
		}
	}
	> li.over > a{
		pointer-event:none;
		opacity:0.5;
		//z-index: 20;
	}
}

/*Upcoming Meeting Pager*/
.pager{

	width:100%;
	text-align:center;
	background: #fff url("@{path}view-toolbar-gradient.png") left bottom repeat-x;
	.b-shadow(inset 0 1px 0 #DFDFDF );
	overflow: hidden;
	ul{
		display: block;
		width:50%;
		margin:0 auto;

		list-style: none;
		border-left: 1px solid #DFDFDF;
		.clearfix();
	}
	.endless-list-pager{
		width:100%;
		list-style:none;
		border: 1px solid #DFDFDF;
		border-top: none;
		li{
			float:none;
			width:100%;
			border:none;
		}
		.next a:after, .hidden.next:after{
			content:"6";
			.symbly(18px);
		}
		.hidden{
			display: none;
		}
	}
	li{

		float:left;
		width:30%;
		padding:0;
		border:none;
		border-right: 1px solid #DFDFDF;
		text-align: center;
		> a{
			font-weight:bold;
			display:block;
			span{
				display:none;
			}
			&:active{
				color:#656565;
				.b-shadow(~"inset 0 5px 10px 0px rgba(153, 153, 153, 0.45)");
			}
		}
	}
	.refresh{
		width:0;
		display: none;
	}
	.first, .last{
		width: 20%;
	}
	.first a:after, .hidden.first:after{
		content:"«";
	}
	.next a:after, .hidden.next:after{
		content:"›";
	}
	.previous a:after, .hidden.previous:after{
		content:"‹";
	}
	.last a:after, .hidden.last:after{
		content:"»";
	}
	.next, .previous, .first, .last{
		font-size:14px;
		line-height: 1;
		font-weight: bold;
		span{
			text-indent:-9999px;
			display: inline-block;
			padding:2px 0 4px 0 !important;
		}
		&.hidden:after{
			color:#ccc;
		}
	}
	a:hover:before,
	a:hover:after{
		color: @themeColor2;
	}
	//doesnt work in IE
	&:empty{
		display:none;
	}
}

.juiportlet-widget .endless-list-pager{
	border:none;
}

#list-view .pager{
	.b-shadow(none);
	clear: both;
}

#ModalView #list-view .pager{
	.b-shadow(inset 0 1px 0 #DFDFDF );
}

/*=Meetings modal*/
#days-meetings-list-view{
	td{
		padding:10px;
		div{
			line-height:150%;
		}
	}
	tr{
		&:hover{
			background:none;
			color:@textColor;
		}
		&:first-child td{
			border-top:none;
		}
	}
	h3{
		color:@textColor;
		margin-bottom:4px;
		span{
			font-weight:normal;
			font-size:11px;
			padding-left:10px;
			a{
				outline: none;
			}
		}
	}
}

#DaysMeetingsFromCalendarModalListView{
	.view-toolbar-container{
		position: absolute;
		top:8px;
		right:0px;
		width: auto;
	}
}

.meeting-summary{
	position: relative;
}

.meeting-details{
	background-color: #dfdfdf;
	float: right;
}

/*=Meeting/Task Single View*/
#NoteEditAndDetailsView,
#TaskEditAndDetailsView,
#MeetingEditAndDetailsView{
	.details-table{
		margin-right:0 !important;
	}
	.view-toolbar {
		margin-top:0 !important;
	}
}

/*=Latest Activity*/
.less-pronounced-text{
	font-style:italic;
	color:#999;
}

.latest-activity-icon{
	position:relative;
	top:-3px;
	color:#666 !important;
	.symbly(42px);
	line-height:28px;
}

.LatestActivitiesForPortletView{
	position: relative;
	> div{
		position: relative;
		z-index: 1;
	}
	.toolbar-mbmenu {
		position: absolute;
		top: -35px;
		z-index: 10;
	}
}

.LatestActivitiesListView,
.LatestActivitiesView{
	form{
		position: relative;
	}
	.latest-activity-toolbar{
		border-bottom:1px solid #DFDFDF;
		padding:10px 15px;
		#gradient > .vertical(#f6f6f6, #ededed);
		.b-shadow(inset 0 1px 0 0 #ffffff);
		> div:first-child{
			padding-right:10px;
			margin-right:10px;
			border-right:2px solid @themeColor;
		}
		#LatestActivitiesConfigurationForm_ownedByFilter_area{
			display:inline-block;
		}
		#LatestActivitiesConfigurationForm_rollup_area{
			display:inline-block;
		}
		#filter-latest-activities-link{
			margin-left:20px;
			text-decoration: none;
			.t-shadow( rgba( 255, 255, 255, 0.8 ) 0 1px 0 );
			&:after{
				content: "÷";
				.symbly(14px);
				position:relative;
				top:1px;
				margin-left:5px;
			}
			&:hover{
				color: @themeColor2 !important;
			}
		}
	}
	.items{
		border:none !important;
	}
	td, th{
		padding:10px 0;
		border-bottom: 1px solid #DFDFDF;
		div{
			font-weight: 400 !important;
			margin: 0;
		}
	}
	tr{
		&:last-child{
			td, th{
				border-bottom:none;
			}
			td:first-child{
			}
		}
	}
	td:first-child{
		border-top:none !important;
		padding-left:15px !important;
		padding-right:15px;
	}
	.activity-item{
		width: 100%;
		padding-left:40px;
		position: relative;

		span{
			line-height: 140%;
			word-break: break-all;
			a{
				break-word: break-all;
				display: inline-block;
			}
		}
	}
	.items em{
		display:inline-block;
		height:100%;
		padding-right:15px;
		float:left;
		font-style:normal;
		position:absolute;
		left:0;
		top:2px;
	}
	.Note:after{
		content: "3";
		.latest-activity-icon();
	}
	.Task:after{
		content: "4";
		.latest-activity-icon();
	}
	.Meeting:after{
		content: "U";
		.latest-activity-icon();
	}
	.EmailMessage:after{
		content: "g";
		.latest-activity-icon();
	}
	.Conversation{
		padding-top:5px;
		&:after{
			content: "b";
			.latest-activity-icon();
		}
	}
	.Mission:after{
		content: "Q";
		.latest-activity-icon();
	}
}

#GameRewardsSearchForm_filteredBy_area,
#MashableInboxForm_filteredBy_area,
#MashableInboxForm_optionForModel_area,
.latest-activity-toolbar,
.filter-portlet-model-bar{
	.smaller();
	padding-left:8px;

	label{
		cursor:pointer;
		border:none;
		background:none;
		font-size:11px !important;
		padding:3px;
		margin:0 3px;
		white-space: nowrap;
	}
	label:hover{
		color:#FFF;
		.radius(3px) !important;
		border:none;
		background-color: @themeColor !important;
	}
	input[type="radio"], input[type="checkbox"]{
		visibility:hidden;
		display:none;
	}
	.ui-state-active{
		color:#FFF;
		.radius(3px) !important;
		border:none;
		background-color: @themeColor !important;
	}
	.ui-button-text{
		padding:0;
		margin:0;
	}
}

#GameRewardsSearchForm_filteredBy_area{
	display: inline-block;
	margin-left: 15px;
	left: 420px;
	top: 21px !important;
	label{
		float: none;
	}
}

.filter-portlet-model-bar{
	border-bottom:1px solid #DFDFDF;
	//overflow: hidden;
	width: 100%;
	min-height: 40px;
	#gradient > .vertical(#f6f6f6, #ededed);
	.b-shadow(inset 0 1px 0 0 #ffffff);
	position:relative;
	> .ui-buttonset{
		//margin: 14px 0;
		padding-top:14px
	}
}

.activity-date{
	font-size:11px;
	margin-bottom:3px;
	display: block;
}

.LatestActivtiesForPortletView{
	position:relative;
	.toolbar-mbmenu{
		z-index:999999;
		top:-34px;
		right:10px;
		.view-toolbar{
			background:none;
			margin:0;
		}
		li{
			padding:0;
		}
	}
}

/*=Search User Modal*/
.search-view-0{
	input[type="text"]{
		float:left;
		margin-right:0;
	}
}

#search-formmodal{
	position: relative;
	padding:10px 0 10px 0;
	border: 1px solid #DFDFDF;
	border-bottom:none;
	#gradient > .vertical(#f6f6f6, #ededed);
	.b-shadow(none);
	.b-shadow(inset 0 1px 0 0 #ffffff);
	.clearfix();
	table{
		border-bottom:none;
	}
	label{
		line-height: 25px;
	}
}

.ModalListView{
	.items{
		border-top:1px solid #dfdfdf !important;
		tbody td:first-child,
		thead th:first-child{
			padding-left:10px;
		}
	}
}

/*=Auto Complete*/
.ui-autocomplete{
	margin-top:2px;
	width:auto;
	.flyout;
	padding-top:2px;
	padding-bottom:2px;
	text-align:left;
	z-index:9999999 !important;
	position:absolute;
	li{
		list-style:none;
		a{
			border-top: 1px solid #fff;
			border-bottom: 1px solid #CCC;
			color: #666;
			.smaller();
			line-height:100%;
			font-weight: normal;
			display: block;
			padding: 6px 10px 6px 10px;
			margin: 0 2px;
		}
		a:hover, a#ui-active-menuitem, a.ui-state-hover{
			background-color: @themeColor2 !important;
			color:#fff !important;
			cursor:pointer !important;
		}
	}
	li:first-child a{
		border-top:none;
	}
	li:last-child a{
		border-bottom:none;
	}
}

/*=Flash Message View*/
#FlashMessageView{
	position: fixed;
	top:100px;
	width: 25%;
	right: 3%;
	z-index: 9999;
	.jnotify-item{
		position: relative;
		margin:0 20px 20px 0;
		padding:10px;
		border-radius:5px !important;
		border:1px solid #FFCC00;
		background:#FFFCB5;
		font-weight: bold;
		.b-shadow( 0 0 20px 5px rgba(153, 153, 153, 0.5) );
		p, ul{
			margin-bottom: 5px;
			line-height: 1;
		}
		ul{
			padding-left:18px;
		}
		li{
			margin-bottom: 3px;
		}
	}
	.ui-state-error{
		border:1px solid #cc0000;
		background:#ffb5b5;
	}
	.ui-icon-circle-close{
		position: absolute;
		top:-17px;
		right:-15px;
		background: transparent url("@{path}widget-close-btn.png") left top no-repeat;
		padding: 0 !important;
		margin:0 !important;
		width:30px !important;
		height: 31px !important;
		cursor:pointer;
	}
}

.operation-description{
	display: block;
	margin: 0 0 15px 0;
	line-height: 150%;
	strong{
		font-weight:bold;
	}
	em{
		color: #cc0000;
		font-style: normal;
	}
}


/*Dropdowns*/
.hasDropDown{
	//width: 100%;
	margin: 0;
	padding: 0;
	position: relative;
	cursor: pointer;

	span{
		width: 28px;
		height: 24px;
		position: absolute;
		top:1px;
		right: 1px;
		z-index: 1;
		pointer-events:none;
		background: url("@{path}dropdown-arrow.png") 100% 0 no-repeat;
		padding-left: 6px;
		display: block !important;
		font-weight: normal !important;
		color: #666 !important;
		cursor:pointer;
	}
	span:hover,
	.over-dd{
		background-position: 100% 100%;
	}
	select{
		z-index: 0;
		-moz-appearance: none;
		-webkit-appearance: none;
		appearance: none;
		margin: 0;
		padding: 3px 0;
		height: 26px;
		line-height: 26px;
		line-height: 1;
		width: 100%;
		border: 1px solid #ccc;
		.radius(3px);
		font-size: 12px;
		color: #666;
		text-indent: 6px;
		vertical-align: middle;

		.b-shadow(0 0 1px 1px rgba(153, 153, 153, 0.3));
		outline: none !important;
		cursor: pointer;
		position: relative;
		&:focus,
		&:hover{
			outline: none;
			.b-shadow(0 0 1px 1px @themeColor);
		}
	}
	&:hover select{
		outline: none;
		.b-shadow(0 0 1px 1px @themeColor);
	}
	+ input{
		margin-top:15px;
	}
}

.isMultiSelect{
	select{
		height: auto;
	}
	span{
		display: none !important;
	}
}



/*=Mass Edit + DELETE view*/
.AppContent.MassEditView{
	#edit-form table{
		width:100%;
	}
	.hasCheckBox{
	}
	tr th:first-child{
		padding:0 !important;
	}
	.ui-state-highlight p{
		color: @themeColor;
		text-align:left;
		font-size:13px;
		font-style:normal;
		font-weight:bold;
		padding-left:0;
		margin-bottom:30px;
		margin-left:-8px;
	}
}

/*=Lead Conversion*/
#LeadConvertView{
	.DetailsView > div{
		border:none !important;
		background:none !important;
		.b-shadow(none);
	}
	.panel{
		width: 100% !important;
	}
	#edit-form{
		border:none !important;
		background:none !important;
		.b-shadow(none);
		padding-bottom: 0 !important;
		table{
			width:100%;
			padding-bottom: 0 !important;
			margin-bottom: 0 !important;
		}
	}
	form table{
		padding-bottom: 15px !important;
	}
	#account-skip-form{
		th{
			text-align:center !important;
			font-weight:normal;
		}
	}
}

#AccountConvertToView{
	> div{
		margin-bottom: 0;
	}
	.left-column{
		padding-right: 0;
	}
}

.lead-conversion-actions{
	padding:15px 15px 5px 15px;
	a{
		.zLink();
	}
}

/*=Progress*/
.ProgressView{
	h3{
		position:relative;
	}
	#sequential-process-spinner + #progressBar-msg{
		display:block;
		//text-indent:30px;
	}
}

.progress-counter{
	padding:15px 15px 15px 15px;
}

#progressBar-links {
	margin-top: 15px;
	a {
		//.z-button();
		margin-left: 0;
	}
}

.progressbar-wrapper{
	width:100%;
	position: relative;
	margin-top: 15px;
}

#progress-percent{
	width:50px;
	display: inline-block;
	font-weight: bold;
}

.ui-progressbar{

	padding-left:35px;
	position: absolute;
	top:0;
	left: 0;
	height:5px;
	width:100%;
}

.ui-widget-header.ui-progressbar-value{
	.radius(3px);
	height:5px;
	margin:5px 0 0 0;
	.animateAll(0.2s);
	background-color: transparent !important;
	#gradient > .directional( rgb(150, 150, 150), rgb(175, 175, 175), 0deg ) !important;
}

/*=About*/
#AboutView{
	position: relative;
	#ZurmoLogo{
		width:300px;
		strong{
			float:right;
			margin-top:26px;
		}
	}
	h1{
		text-indent:15px;
		font-size:15px;
		height: 40px;
		line-height: 40px;
		#gradient > .vertical(#f6f6f6, #ededed);
		.b-shadow(inset 0 1px 0 0 #ffffff);
		border-bottom:1px solid #ccc;
	}
	> div{
		margin-right:0;
		margin-bottom:20px;
		border:1px solid #ccc;
		.b-shadow(~"inset 0 0 0 2px #ffffff,  0 0 9px 5px rgba(153, 153, 153, 0.12)");
		#gradient > .vertical-three-colors( #ffffff, #f5f5f5, 80%, #f5f5f5 );
	}
	#aboutText{
		position: relative;
	}
	#leftCol{
		padding:15px 0 50px 15px;
		width:65%;
		float:left;

		> div{
			margin-bottom:20px;
		}
	}
	#rightCol{
		float:right;
		width:30%;
		margin:15px 15px 50px 0;

		> div {
			padding: 8px 10px;
			background: #F4F4F4;
			margin-bottom:15px;
			float:left;
		}
	}
	#aboutContactDetails{
		width:100%;
		float:left;
		padding:15px 0 5px 0;
		text-align:center;
		font-size:11px;
		position: absolute;
		bottom:0;
		span{
			margin: 0 10px;
		}
	}
	p, ul{
		font-size:12px;
		line-height: 21px;
		font-weight:normal;
		a{
			text-decoration:underline !important;
			color: @themeColor !important;
		}
	}
	ul{
		margin-top:4px;
		padding-left:20px;
	}
}

.social-links{
	list-style:none;
	padding:0 !important;
	margin:15px 0 !important;
	float:right;
}
.social-links li{
	margin:0 0 0 5px;
	float:left;
}
.social-links a{
	color: #fff;
	font-size: 12px;
	text-indent: 0;
	display: block;
}
.social-links a:hover span{
	background-position-y: 0 !important;
}
.social-links span{
	background: url("@{path}sprite-socialicons.png") 0 bottom no-repeat;
	height: 22px;
	width: 22px;
	display: inline-block;
	line-height: 22px;
	text-indent: -9999px;
	margin-right: 5px;
}
.facebook span{
	background-position: -88px bottom !important;
}
.twitter span{
	background-position: -22px bottom !important;
}
.linkedin span{
	background-position: -66px bottom !important;
}
.rss span{
	background-position: 0 bottom !important;
}
.bitbucket span{
	background-position: -132px bottom !important;
}
.pivotal span{
	background-position: 100% bottom !important;
}

/*=RSS Widget*/
.rssBody{
	line-height: 140%;
	ul{
		list-style: none;
	}
	li{
		padding:10px 15px;
		border-bottom:1px solid #dfdfdf;
		&:last-child{
			border-bottom:none;
		}
	}
}

/*=Search Results - Mixed Search Results*/
#MixedModelsSearchView{
	position:relative;
	z-index:5;
	margin-bottom: 15px;
	float: left;
	width: 100%;
	h1{
		margin-bottom:15px;
	}
	.search-view-0{
		float: none;
		margin:15px 0 10px 15px;
	}
}

#MixedModelsMultipleListsView{
	position:relative;
	z-index:1;
	margin-top:15px;
	h1{
		margin-bottom: 15px;
	}
}

#MixedModelsSearchAndListView{
	th:first-child{
		padding-left:10px;
	}
	.pager{
		.b-shadow(none) !important;
		//.no-ie-shadow();
		border: 1px solid #DFDFDF;
		border-top: none;
		ul{

		}
	}
}

.TitleBarView{
	&.Account h1:before{
		content: "P";
		.symbly(36px);
		margin-right:15px;
		position: relative;
		top:0;
	}
	&.Contact h1:before{
		content: "y";
		.symbly(36px);
		margin-right:15px;
		position: relative;
		top:1px;
	}
	&.Opportunity h1:before{
		content: "9";
		.symbly(36px);
		margin-right:15px;
		position: relative;
		top:1px;
	}
	&.Lead h1:before{
		content: ".";
		.symbly(36px);
		margin-right:15px;
		position: relative;
		top:1px;
	}
}

/*Products Portlet*/
.products-portlet-totals{
	display: block;
	padding: 10px;
	border-top: 1px solid #DFDFDF;
	background:#111 url("@{path}dark-texture-table-footer.png") left top repeat-x !important;
	color:#FFF;
	font-weight: bold;
}

.empty + .pager + .products-portlet-totals{
	display:none;
}

.editable-cell{
	border-bottom: 1px dotted #ccc;
	width: auto;
	display: inline-block;
	//padding-bottom: 2px;
	//margin-top: 3px;
	&:after{
		content:"!";
		.symbly(20px);
		position: relative;
		right: -10px;
		top: 1px;
		line-height: 1;
		cursor: pointer !important;
		&:hover{
			cursor: pointer;
		}
	}
}

@import 'mixins.less';
@import 'icons.less';
@import 'buttons.less';
@import 'widget-juiportlets.less';
@import 'reports.less';